Панель обтекания: невозможно отобразить несколько кнопок

Question

Я не могу видеть все три кнопки. Видна только первая кнопка. Следующий код:

 <Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <!--TitlePanel contains the name of the application and page title-->


    <Image Name="Title_image" Stretch="Uniform"  Source="Title.png" Margin="0,0,0,60" Grid.Row="1" Visibility="Visible" />

    <!--ContentPanel - place additional content here-->
    <toolkit:WrapPanel Name="empty" Orientation="Horizontal" Grid.Row="1"  >
        <Button  Margin="0,695,336,-13"  Click="On_PhotoClick" Height="83" Width="124">
            <StackPanel Orientation="Vertical">
                <Image Source="ic_right.png" Height="23" Width="53" />
                <TextBlock Text="  Photo" Height="27" FontSize="17" Width="67" />
            </StackPanel>
        </Button>
        <Button Margin="179,702,170,-13"  BorderBrush="#FF867F7F" Background="#009A8E8E" >
            <StackPanel Orientation="Vertical">
                <Image Source="icon_list_a.png"  />
                <TextBlock Text="  List" Height="33" FontSize="20" />
            </StackPanel>
        </Button>
        <Button  Margin="367,702,-12,-13" >
            <StackPanel Orientation="Vertical">
                <Image Source="icon_list_a.png" />
                <TextBlock Text="Information" Height="33"  FontSize="20"/>
            </StackPanel>
        </Button>
    </toolkit:WrapPanel>
</Grid>

Может кто-нибудь подсказать, в чем может быть проблема

Answer 1

Тогда вам нужно что-то вроде этого:

<Grid x:Name="LayoutRoot"
      Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <!--TitlePanel contains the name of the application and page title-->
    <Image Name="Title_image"
           Stretch="Uniform"
           Source="Title.png"
           Grid.Row="0"
           Visibility="Visible" />
    <!--ContentPanel - place additional content here-->
    <toolkit:WrapPanel Name="empty"
                       Orientation="Horizontal"
                       Grid.Row="1"
                       ItemWidth="128"
                       ItemHeight="128">
        <Button Click="On_PhotoClick">
            <StackPanel Orientation="Vertical">
                <Image Source="ic_right.png" />
                <TextBlock Text="Photo"
                           FontSize="20" />
            </StackPanel>
        </Button>
        <Button>
            <StackPanel Orientation="Vertical">
                <Image Source="icon_list_a.png" />
                <TextBlock Text="  List"
                           FontSize="20" />
            </StackPanel>
        </Button>
        <Button>
            <StackPanel Orientation="Vertical">
                <Image Source="icon_list_a.png" />
                <TextBlock Text="Information"
                           FontSize="20" />
            </StackPanel>
        </Button>
    </toolkit:WrapPanel>
</Grid>

На что обратить внимание:

• На верхнем изображении неправильно Grid.Row. (Было 1 (второй ряд), должно быть 0 (первый ряд))
• Чтобы назначить одинаковую высоту / ширину, используйте свойство ItemHeight / ItemWidth WrapPanel.
• Избегайте использования этих уродливых полей. Обычно дизайнер их генерирует. Обязательно очистите их.
• Избегайте назначения явной высоты / ширины отдельным элементам.

Answer 2

установка высоты и ширины. Изображение внутри StackPanels

<Image Source="ic_right.png" Height="23" Width="53" />