动态创建项目的对齐方式

时间:2011-12-06 07:48:37

标签: wpf user-interface alignment

Category Image

您好,

根据上面的图片,我想将“动作”,“冒险”,“拱廊”等词放在最左边,并将其对齐显示与蓝色右箭头相同的高度

我的代码是动态创建的:

            Dim intRow As Integer
            Dim intColumn As Integer


            intRow = 0
            intColumn = 0
            Dim rd As RowDefinition

            For Each abc In ArrayOfItems

                Dim newButton As New Button
                newButton.MaxHeight = 35
                newButton.MaxWidth = 300
                newButton.Background = Brushes.Transparent
                newButton.BorderBrush = Brushes.Transparent
                newButton.Tag = abc.application_category_id

                Dim sp As New StackPanel

                sp.Orientation = Orientation.Horizontal
                sp.HorizontalAlignment = Windows.HorizontalAlignment.Left
                sp.VerticalAlignment = Windows.VerticalAlignment.Center

                Dim Image2 As New Image
                Dim src As New Uri("/Images/chevron_blue.png", UriKind.Relative)
                Dim img As New BitmapImage(src)

                Image2.Width = 10
                Image2.Height = 10
                Image2.HorizontalAlignment = Windows.HorizontalAlignment.Left
                Image2.VerticalAlignment = Windows.HorizontalAlignment.Left
                Image2.Source = img

                Dim LabelApp As New Label
                LabelApp.Content = abc.category_name
                LabelApp.FontWeight = FontWeights.Bold
                LabelApp.FontSize = 9
                LabelApp.MaxWidth = 270
                LabelApp.Foreground = Brushes.Black
                LabelApp.HorizontalContentAlignment = Windows.HorizontalAlignment.Left
                LabelApp.VerticalAlignment = Windows.HorizontalAlignment.Left

                sp.Children.Add(LabelApp)
                sp.Children.Add(Image2)

                newButton.Content = sp

                Grid.SetColumn(newButton, intColumn)
                Grid.SetRow(newButton, intRow)
                gridCategoryGames.Children.Add(newButton)


                intRow = intRow + 1

                rd = New RowDefinition With {.Height = GridLength.Auto}

                gridCategoryGames.RowDefinitions.Add(rd)
                gridCategoryGames.UpdateLayout()


            Next abc
        End If

1 个答案:

答案 0 :(得分:2)

哎呀,这是一种丑陋的方式:)

幸运的是,WPF会将代码大幅减少ItemsControl。正如你已经ArrayOfItems显然是IEnumerable,你可以像这样制作XAML:

    <ItemsControl ItemsSource="{Binding ArrayOfItems}" >
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Vertical" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate >
                <StackPanel Orientation="Vertical" HorizontalAlignment="Right" >
                    <TextBlock Text="myText"/>
                    <Image Source="path to my image" />
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

然后,您可以删除手动创建项目的所有代码。对于列表中的每个项目,将重复ItemsControl.ItemTemplate中指定的控件。天空是这种方法的极限(关于如何使用此控件的字面thousands of examples)。