1

幅が固定され、子の量が可変/不明なStackPanel (Orientation="Horizo​​ntal") があるとします。XAML (コードではなく) ですべての子に幅をすべて等しく設定するように指示するにはどうすればよいですか? StackPanel の幅全体を埋めますか?

子の数がわかっている場合は Grid を使用するのは簡単ですが (ColumnDefinitions を Width="*" で使用するだけです)、パネル (StackPanel、Pivo​​tHeaderPanel など) またはリスト (GridView、 ListView など)。

4

1 に答える 1

2

あなたの説明によると、必要なのは WPF の UniformGrid のようなパネルです。UniformGrid は、グリッド内のすべてのセルが同じサイズであるグリッドにコンテンツを配置する方法を提供します。ただし、UWP には組み込みの UniformGrid はありません。自分で実装することも、 WinRTXamlToolkit のようなサードパーティの UniformGrid を使用することもできます。

ここでは、たとえば WinRTXamlToolkit で UniformGrid を使用しています。WinRTXamlToolkit を使用するには、nuget: WinRT XAML Toolkit for Windows 10からインストールできます。

次にxmlns、次のようなページを追加します。

xmlns:toolkit="using:WinRTXamlToolkit.Controls"

この後、次のように UniformGrid を使用できます。

<toolkit:UniformGrid Rows="1" />

ここでは、プロパティを に設定し、Rowsプロパティを1デフォルトColumns値に設定します0。Columns プロパティの値がゼロ (0) の場合、行数と Grid にある表示可能な子要素の数に基づいて列数が計算されることを指定します。したがって、この UniformGrid のすべての子は 1 つの行に配置され、これは UniformGrid であるため、すべての列が同じ幅になります。

以下は、UniformGrid を の として使用するサンプルItemsPanelですGridView。

XAML:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <StackPanel>
        <GridView x:Name="MyGridView" Height="60">
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <toolkit:UniformGrid Rows="1" />
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>

            <GridView.ItemContainerStyle>
                <Style TargetType="GridViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                </Style>
            </GridView.ItemContainerStyle>

            <GridView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Background="Red">
                        <TextBlock HorizontalAlignment="Center" FontSize="30" Text="{Binding }" />
                    </StackPanel>
                </DataTemplate>
            </GridView.ItemTemplate>
        </GridView>
        <Button Click="Button_Click">Add a item</Button>
    </StackPanel>
</Grid>

分離コード:

public sealed partial class MainPage : Page
{
    private ObservableCollection<string> myList = new ObservableCollection<string> { "1", "2", "3", "4", "5" };
    private int i = 6;

    public MainPage()
    {
        this.InitializeComponent();
        MyGridView.ItemsSource = myList;
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        myList.Add(i.ToString());
        i += 1;
    }
}

そして、それは次のようになります：
ここに画像の説明を入力

于 2016-05-06T10:51:34.187 に答える