uwp, как изменить размеры элементов в шаблонном источнике элементов сразу? - PullRequest
Новая
       16

uwp, как изменить размеры элементов в шаблонном источнике элементов сразу?

2 голосов
/ 19 марта 2019

У меня есть это представление списка, и я хочу динамически изменять размеры свойств элемента (размер шрифта, ширина и высота и т. Д.) При изменении размера окна. До сих пор я был в состоянии сделать это, изменяя расположение элементов источника элемента один за другим в c # (с циклом for). По мере того, как количество элементов списка увеличивается, эффект позже становится глючным. Интересно, есть ли способ единообразно изменить стиль этих шаблонных элементов в списке? Я попытался использовать и изменить стиль staticResource, который применяется к шаблону, но безрезультатно. 

 <ListView
        x:Name="leftMenubar"
        Grid.Column="0"
        Height="auto"
        VerticalAlignment="Top"
        VerticalContentAlignment="Stretch"
        IsItemClickEnabled="True"
        ItemClick="LeftBarMenuItemClicked"
        ItemsSource="{x:Bind Items}"
        Loaded="LeftMenubar_Loaded">
        <ListView.Resources>
            <SolidColorBrush x:Key="ListViewItemBackgroundPointerOver" Color="Transparent" />
            <SolidColorBrush x:Key="ListViewItemBackgroundPressed" Color="Transparent" />
            <SolidColorBrush x:Key="ListViewItemBackgroundSelectedPressed" Color="Transparent" />
            <SolidColorBrush x:Key="ListViewItemBackgroundSelected" Color="Transparent" />
            <SolidColorBrush x:Key="ListViewItemBackgroundSelectedPointerOver" Color="Transparent" />
        </ListView.Resources>
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="VerticalAlignment" Value="Center" />
                <Setter Property="HorizontalAlignment" Value="Center" />
                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            </Style>
        </ListView.ItemContainerStyle>

        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsStackPanel
                    Margin="0"
                    VerticalAlignment="Top"
                    GroupPadding="0"
                    Orientation="Vertical" />
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="local:LeftMenuBarItem">
                <StackPanel Margin="0,0,0,0" Padding="{x:Bind Pad, Mode=OneWay}">
                    <BitmapIcon
                        Height="{x:Bind IconHeight, Mode=OneWay}"
                        MinHeight="20"
                        Margin="0,0,0,0"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Stretch"
                        Foreground="{x:Bind Foreground, Mode=OneWay}"
                        UriSource="{x:Bind ImgPath}" />
                    <TextBlock
                        Width="Auto"
                        Margin="0,5,0,0"
                        HorizontalAlignment="Center"
                        FontSize="10"
                        Foreground="{x:Bind Foreground, Mode=OneWay}"
                        Text="{x:Bind Title}" />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

Ответы [ 2 ]

2 голосов
/ 19 марта 2019

Вы можете сделать это несколькими различными способами. Вы можете настроить шаблон данных, чтобы привязать размер шрифта к высоте элемента управления и рассчитать там. Но тогда у вас есть конвертер для каждого элемента в вашем списке.

Я думаю, что лучший способ - это установить одну привязку для ListViewItem к FontSize (и другим свойствам) на ListView Вот пример того, как вы можете настроить 

class AdjustableListView : ListView
{
    public AdjustableListView()
    {
        SizeChanged += OnSizeChanged;
    }

    protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
    {
        base.PrepareContainerForItemOverride(element, item);

        var listItem = (ListViewItem)element;
        var binding = new Binding { Source = this, Path = new PropertyPath("FontSize")};
        listItem.SetBinding(ListViewItem.FontSizeProperty, binding);
    }

    private void OnSizeChanged(object sender, SizeChangedEventArgs e)
    {
        FontSize = Math.Max(12, e.NewSize.Height / 24);
    }
}
0 голосов
/ 01 апреля 2019

Пользовательские элементы управления позволяют вам инкапсулировать общие фрагменты XAML, которые вы собираетесь часто использовать, будь то на одной странице или во всем приложении. Тем не менее, пользовательские элементы управления наиболее полезны, когда вы хотите изменить размер шаблона данных для GridView или ListView при использовании адаптивного макета, я думаю, что это лучший подход для решения этой задачи.

Это видео показывает вам, как.

Боб Табор объясняет, как использовать пользовательские элементы управления в качестве шаблонов данных

...