3

XAML C#グループ化されたGridViewサンプルを使用して、SemanticZoomをXAML C#Windows8アプリで機能させようとしています。問題は、何らかの理由で正しいヘッダー(この場合はカテゴリ)が表示されているのに、ヘッダーの下にすべてのアイテムが表示されていないことです(一部のアイテムに最大6つのアイテムがある場合、それぞれに1つしか表示されません) )。

SemanticZoomのXAMLコードは次のとおりです(簡潔にするためにZoomedOutViewを省略し、完全に機能していることに注意してください)。

<SemanticZoom x:Name="boardZoom" Height="626" Margin="10,132,10,0" VerticalAlignment="Top">
    <SemanticZoom.ZoomedInView>
        <GridView IsSwipeEnabled="True" x:Name="ItemsGridView" Tapped="Tapped" ItemsSource="{Binding Source={StaticResource cvs2}}" SelectionChanged="selChanged">
            <GridView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Margin="10,10,0,0" 
                    HorizontalAlignment="Left" VerticalAlignment="Stretch">
                        <Image Source="{Binding Thumbnail}"></Image>                                
                       <TextBlock Text="{Binding Title}" TextWrapping="Wrap" Width="500"
                            FontFamily="Global User Interface" FontSize="40" VerticalAlignment="Top" />                                
                        <TextBlock Text="{Binding pinNumber}" x:Name="PinNum" Visibility="Collapsed"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </GridView.ItemTemplate>         
            <GridView.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                           <TextBlock Text='{Binding Key}' Foreground="White" Margin="5" FontSize="20" FontFamily="Segoe UI Light" />
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                    <GroupStyle.ContainerStyle>
                        <Style TargetType="GroupItem">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="GroupItem">
                                        <StackPanel Orientation="Vertical">
                                            <ContentPresenter Content="{TemplateBinding Content}" />
                                            <ItemsControl x:Name="ItemsControl" ItemsSource="{Binding GroupItems}" />
                                        </StackPanel>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </GroupStyle.ContainerStyle>
                    <GroupStyle.Panel>
                        <ItemsPanelTemplate>
                            <VariableSizedWrapGrid Orientation="Vertical" MaximumRowsOrColumns="5" />
                        </ItemsPanelTemplate>
                    </GroupStyle.Panel>
                </GroupStyle>
            </GridView.GroupStyle>
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid Orientation="Vertical" MaximumRowsOrColumns="1" />
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>
        </GridView>
    </SemanticZoom.ZoomedInView>

アプリの起動時に呼び出されるRefresh()C#関数:

System.Collections.ObjectModel.ObservableCollection<SemanticZoomed> finalSource = new System.Collections.ObjectModel.ObservableCollection<SemanticZoomed>();
public async Task<bool> Refresh()
{
    var Pins = await pinTable.ReadAsync(); //pinTable is an Azure Mobile Services table
    List<string> categoriesMixed = new List<string>();
    if (Pins.ToArray().Length < 1)
    {
        //adds a new "Welcome" pin to the table, taken out for brevity
    }
    foreach (pin nowPin in Pins)
    {
        SemanticZoomed toAdd = new SemanticZoomed();
        toAdd.Category = nowPin.category;
        toAdd.pinNumber = nowPin.Id.ToString();
        toAdd.Title = nowPin.name;
        categoriesMixed.Add(nowPin.category);
        finalSource.Add(toAdd);
    }

    List<GroupPinList<object>> groups = new List<GroupPinList<object>>();

    var query = from nowPin in finalSource
        orderby ((SemanticZoomed)nowPin).Category
                group nowPin by ((SemanticZoomed)nowPin).Category into g
                select new { GroupName = g.Key, Items = g };
    foreach (var g in query)
    {
        GroupPinList<object> info = new GroupPinList<object>();
        info.Key = g.GroupName;
        foreach (var item in g.Items)
        {
           info.Add(item);
        }
        groups.Add(info);
    }
    cvs2.Source = groups;
    (boardZoom.ZoomedOutView as ListViewBase).ItemsSource = cvs2.View.CollectionGroups;
    return true;
}

そして、groups変数がどのように見えるか、そして結果のSemanticZoomが何を示すかについてのいくつかのスクリーンショットがあります:

グループ変数:

グループ変数

groups変数の「Welcome」カテゴリ(6つの項目が正しく表示され、以下のcvs2に表示されないimgSrcの横にある「フィールド'imgSrc'の値を取得できません。含まれているクラスに関する情報が利用できないため」というエラーも表示されます) :

ウェルカムカテゴリ

cvs2(Welcomeカテゴリの下に6つの異なるアイテムが表示されます):

cvs2

そして最後に、それが最終的に表示するもの:

最終結果

ウェルカムカテゴリの他のピンがどこに行ったのか途方に暮れています。XAMLコードに欠けているものがありますか?どんな助けでも大歓迎です:)

4

3 に答える 3

1

私も同じ問題を抱えてる 。そしてこれはpbを解決しました。

SemanticZoom.ZoomedInViewで置換

<ItemsPanelTemplate>
<WrapGrid Orientation="Vertical" MaximumRowsOrColumns="1" />
</ItemsPanelTemplate>

<ItemsPanelTemplate>
         <VirtualizingStackPanel Orientation="Vertical"/>
</ItemsPanelTemplate>
于 2013-05-08T16:05:47.630 に答える
0

問題がどこにあるかはわかっていると思います。これは、GridViewにプログラムでグループごとにアイテムを追加する場合に発生します。ここで発生するのは、n個のアイテムを含む最初のグループをGridViewソースに追加すると、番号nが保持され、その後に追加された各グループについて、アイテムがさらにある場合でも、n個以下のアイテムが表示されます。

したがって、2,4,1,5,3アイテムのコレクションに5つのグループがある場合、GridViewのItemSourceとして空のObservableCollectionを割り当ててから、これらのグループをObservableCollectionに追加すると、2,2、各グループに1,2,2個のアイテム。

これが機能またはバグである場合、なぜこれが発生するのかはわかりませんが、最初にObservableCollectionをロードしてから、ソースとしてGridViewに割り当てることで解決できます。または、ある種のコンバーターを使用することもできます。各グループに同じ数のアイテムを返します。数が少ないグループの場合は、偽の空のアイテムを追加し、別のDataTemplateを使用してそれらを非表示にします。

編集:あなたがすでにコレクションを一度に追加していることに気づいたので、問題はおそらく他の場所にあります。たぶんあなたの問題の根本はItemsPanelのこれですか?

MaximumRowsOrColumns="1"
于 2012-10-11T07:41:41.010 に答える
0
you need to use stackpanel instead of  WrapGrip in ItemPanelTemplate

<GridView.ItemsPanel>
           <ItemsPanelTemplate>
               <StackPanel Orientation="Horizontal" />
           </ItemsPanelTemplate>
</GridView.ItemsPanel>
于 2012-10-30T15:11:29.787 に答える