开发者

Organizing layout of controls in ScatterViewItem

I have a scatterview item which has following contents in order mentioned in vertical order.

  1. TextBlock which will show 1-3 lines of text - TextBlock1

  2. Image - size will vary based on image resolution, but i will set a minimum height, width in property.

  3. TextBlock - this will show 1-10 lines of text - TextBlock2

  4. A surface toggle button

Now a user can scale this item, hence i had put this in viewbox. The XAML code is below:

<DockPanel LastChildFill="False">
    <TextBlock Name="ItemTitle" DockPanel.Dock="Top" HorizontalAlignment="Left" VerticalAlignment="Top" Width="120"  Margin="10"  TextWrapping="Wrap"  Visibility="Visible" Padding="2" />
    <s:SurfaceToggleButton  DockPanel.Dock="Bottom" Checked="ItemInfo_Checked" Unchecked="ItemInfo_Unchecked" Margin="5,5,5,5" HorizontalAlignment="Center" VerticalAlignment="Center">Display more info</s:SurfaceToggleButton>
    <Viewbox DockPanel.Dock="Bottom" Stretch="Uniform" MinHeight="100">
        <StackPanel>
开发者_开发技巧            <Image Name="ItemImage" Margin="5,5,5,5"    Visibility="Visible" />
            <TextBlock DockPanel.Dock="Bottom" Name="ItemDesc" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10"  TextWrapping="Wrap"  Visibility="Visible" Padding="2" />
        </StackPanel>
    </Viewbox>
</DockPanel>

The problem in the resulting display is:

  1. The TextBlock2 shows the text in very small size with respect to rest of the items.

  2. Since the TextBlock2 is showing text in small size and inside the stackpanel it is not aligned on the left side with the TextBlock1.

I used Viewbox so that when user scales the item, it will increase the size of text and the image.

Is there a better way to do this? Could using DataTemplates help resolve this issue or its for something else?


wrap the image and textblock elements with separate viewboxes

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜