Wrap panel: not able to show multiple buttons
I am not able to see all the three buttons.Only first button is visible.Following is the code:
<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-->
&l开发者_如何学Got;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>
Can some one suggest what could be the problem
Then you need something like this:
<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>
Things to note:
- Top image had wrong
Grid.Row
. (It was 1 (second row), should be 0 (first row)) - To assign uniform height/width use WrapPanel's ItemHeight/ItemWidth property.
- Avoid using these ugly margins. Usually designer generates them. Make sure to clean them up.
- Avoid assigning explicit Height/Width to individual items.
set height and width Image inside StackPanels
<Image Source="ic_right.png" Height="23" Width="53" />
精彩评论