2

次のシナリオ:

グリッドビューを使用して、グループ化されたデータを表示します。


このグループのアイテムの数を含む必要があるheadertemplateにTextBlockを追加しました。(例えば)

(編集:私のシナリオでは、常に6つのアイテムを表示し、HeaderTemplateのTextBlockの子にオーバーフローを表示したいと思います)

このTextBlockを操作するために、コードから個々のグループヘッダーにアクセスするにはどうすればよいですか?

結果の例を次に示します。

出力例

そしてここに私のGroupHeaderTemplateの簡単な例があります:

<GroupStyle.HeaderTemplate>
   <DataTemplate>
      <TextBlock x:name="overflow"/>
   </DataTemplate>
</GroupStyle.HeaderTemplate>

だから私は、生成されたグループごとに個別に「オーバーフロー」アイテムにアクセスして操作したいと思います!

4

2 に答える 2

2

これがあなたが本当に欲しいものです。

まず、GroupStyleHeaderTemplateを編集します

<GridView.GroupStyle>
    <GroupStyle HidesIfEmpty="True">
        <GroupStyle.HeaderTemplate>
            <DataTemplate>
                <Grid Width="500" Margin="5,0,0,5">
                    <TextBlock HorizontalAlignment="Left">
                        <Run Text="{Binding Name}" />
                        <Run FontFamily="Segoe Ui Symbol" Text="" />
                    </TextBlock>
                    <TextBlock HorizontalAlignment="Right">
                        <Run Text="{Binding Children.Count, FallbackValue=0}" />
                        <Run Text="Items" />
                    </TextBlock>
                </Grid>
            </DataTemplate>
        </GroupStyle.HeaderTemplate>
        <GroupStyle.Panel>
            <ItemsPanelTemplate>
                <VariableSizedWrapGrid />
            </ItemsPanelTemplate>
        </GroupStyle.Panel>
    </GroupStyle>
</GridView.GroupStyle>

私が使用していることに注意してくださいVaraibleSizedWrapGrid

次に、GridViewのロードされたイベントを処理します

class SubtractConverter : IValueConverter
{
    public double Amount { get; set; }
    public object Convert(object v, Type t, object p, string l)
    { return System.Convert.ToDouble(v) - Amount; }
    public object ConvertBack(object v, Type t, object p, string l)
    { throw new NotImplementedException(); }
}

private void GridView_OnLayoutUpdated(object sender, RoutedEventArgs e)
{
    var grid = sender as GridView;
    var converter = new SubtractConverter { Amount = 5 * 2 /* padding x2 */ };
    foreach (GroupItem group in (grid.ItemsPanelRoot as Panel).Children)
    {
        var result = VisualTreeHelper.GetChild(group, 0);
        while (!(result is Grid))
            result = VisualTreeHelper.GetChild(result, 0);
        var items = (result as Panel).Children.OfType<ItemsControl>()
            .First().ItemsPanelRoot;
        var binding = new Binding
        {
            Path = new PropertyPath("ActualWidth"),
            Mode = BindingMode.OneWay,
            Converter = converter,
            Source = items,
        };
        var header = (result as Panel).Children.OfType<ContentControl>()
            .First().ContentTemplateRoot as FrameworkElement;
        header.SetBinding(FrameworkElement.WidthProperty, binding);
    }
}

そして、プレスト!これで、ヘッダーはグループ内のアイテムの幅に完全に合わせたサイズになります。

(デザイナーとして)覚えておくべきこと:

  1. グループ化されたアイテムは、1つの列と同じくらい狭い場合があります。TextTrimmingヘッダーTextBoxesでこれを解決します。
  2. グループ化されたアイテムは、モニターよりも幅が広く、# items画面外にある可能性があります。を含むのMinWidthでこれを解決しgridます。

頑張ってください!

于 2014-05-30T22:04:04.270 に答える
0

VisualTreeHelperExtensionsを使用して、最終的に目的の要素を手に入れることができました。

まず、Nuget経由でXamlToolkitをインストールする必要があります

その後、拡張機能のusingディレクティブを追加します。

using WinRTXamlToolkit.Controls.Extensions;

これで、UI要素でさらにいくつかのメソッドを使用できます。そのうちの1つはgetDescendantsByType()で、これを使用して、グリッドビューが保持するすべてのテキストブロック要素を取得します。オーバーフローテキストブロックにタグを追加しました。これは、gridviewsの子孫を反復処理するときにチェックします。自分で確認してください。

    private void ItemsGridView_Loaded(object sender, RoutedEventArgs e)
    {
        foreach (TextBlock element in this.myGridView.GetDescendantsOfType<TextBlock>())
        {
            if(element.Tag != null && element.Tag.Equals("itemCountBlock")){
                element.Text = "Finally solved!";
            }
        }
    }

これは、変更したいすべてのui要素とプロパティに対して機能するはずです。

于 2013-03-19T14:15:28.887 に答える