CODEWITHSUNDEEP
wpflayouttextblock
Murhaf Sousli
Murhaf Sousli

Reputation: 13306

WPF textBlock expansion inside a layout

I have the following XAML code:

    <DataTemplate x:Key="TileViewDT">
        <DockPanel>
            <StackPanel Height="40.5" DockPanel.Dock="Right" Margin="5,2,5,2" VerticalAlignment="Bottom">
                <TextBlock x:Name="Name" TextWrapping="Wrap" Text="{Binding XPath=@Name}" Width="132" />
                <TextBlock x:Name="Size" Foreground="DarkGray" TextWrapping="Wrap" Text="{Binding XPath=@Size}" />
            </StackPanel>
            <Image x:Name="Img" Source="BtnImg/Computer.png" Stretch="Fill" Margin="10,0,5,0" Width="48" Height="48"/>
        </DockPanel>
    </DataTemplate>

Output:

enter image description here

I'm trying to get the same look of Windows Explorer as much as possible, So I want to keep both of the TextBlocks "Name" and "Size" in the center when the text is short and when the name text's length is longer than the item space it goes up (by 1 line maybe) to get this look :

enter image description here

So how would I be able to do that?

Upvotes: 0

Views: 61

Answers (1)

user1246682
user1246682

Reputation: 206

I think in Stackpanel instead of setting Height you should set MaxHeight and VerticalAlignment property value should be Center instead of Bottom and that should do your work:

<DataTemplate x:Key="TileViewDT">
    <DockPanel>
        <StackPanel MaxHeight="40.5" DockPanel.Dock="Right" Margin="5,2,5,2" VerticalAlignment="Center">
            <TextBlock x:Name="Name" TextWrapping="Wrap" Text="{Binding XPath=@Name}" Width="132" />
            <TextBlock x:Name="Size" Foreground="DarkGray" TextWrapping="Wrap" Text="{Binding XPath=@Size}" />
        </StackPanel>
        <Image x:Name="Img" Source="BtnImg/Computer.png" Stretch="Fill" Margin="10,0,5,0" Width="48" Height="48"/>
    </DockPanel>
</DataTemplate>

Hope it works !!!

Upvotes: 1

Related Questions