TextBlock TextWrapping not wrapping #2 - wpf

OK... so this solution doesn't help
XAML is here
<ListBox ItemsSource="{Binding Path=ContentItems}" Background="White" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="2" Height="Auto" Width="Auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal">
<Label VerticalAlignment="Center" Margin="0,0,0,5">Start</Label><svl:TimeEditor Value="{Binding Path=FormatedStart}" Width="87" HorizontalAlignment="Left" Margin="2,8" Name="dtpStart" FontSize="12" Height="25" VerticalAlignment="Center" />
<Label VerticalAlignment="Center" Margin="0,0,0,5">End</Label><svl:TimeEditor Value="{Binding Path=FormatedEnd}" Width="87" HorizontalAlignment="Left" Margin="2,8" Name="dtpEnd" FontSize="12" Height="25" VerticalAlignment="Center" />
</StackPanel>
<TextBlock Grid.Row="1" TextWrapping="Wrap" Name="tbText" Text="{Binding Path=Data}"></TextBlock>
</Grid>
<Grid Grid.Column="1" Visibility="Collapsed">
</Grid>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

The following will helps for text wrapping:
<ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">

Well your TextBlock does not need to wrap since your specifying Width as Auto for it's ColumnDefinition which allows it to take all the Width it needs to fit Content even at the cost of overflowing. You either need to set the Column's Width to "*" to allow the TextWrapping to kick in when requested width exceeds allowable or manually force a MaxWidth on it using a Binding like
<TextBlock Name="tbText" Grid.Row="1" MaxWidth="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBox}}, Path=ActualWidth}" Text="{Binding Path=Data}" TextWrapping="Wrap" />

Related

WPF Scrollviewer Can't scroll horizontally

I can't find a way to make these images in a scrollviewer horizontally.
They're like this
IMAGE1
IMAGE2
IMAGE3
I want
IMAGE1 IMAGE2 IMAGE3
So I can scroll them horizontally. I've already tried google and stackoverflow and I can't find a working solution :(
Code
<Window x:Class="TESSTTTTTT.MirrorWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MirrorWindow" HorizontalAlignment="Center" VerticalAlignment="Center" WindowStyle="None">
<Grid Name="grid2" HorizontalAlignment="Center" VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" Name="ColumnKinect">
<Image Name="camera2" Height="1800" Width="3200" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<!--
<Canvas Name="canvas2" Height="1800" Width="3200" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden" />-->
<Image Name="imgBodyFrame" Source="{Binding MainWindow.ImageSource}" Height="1800" Width="3200"/>
<!--Stretch="UniformToFill"-->
<Image Name="img3DBodyRotation" Source="{Binding MainWindow.ImageSource}" Height="1800" Width="3200" Visibility="Hidden"/>
</Grid>
<Grid Grid.Column="1" Height="1800" Width="3200" HorizontalAlignment="Stretch" VerticalAlignment="Top" Name="ColumnCatalogo">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="0" Name="scrollViewerCatalogo" Background="AliceBlue"
HorizontalScrollBarVisibility="Disabled"
VerticalScrollBarVisibility="Visible">
<ItemsControl Grid.Row="0" Name="itemsControl" HorizontalAlignment="Center" VerticalAlignment="Stretch">
<ItemsControl Name="itcCatalogo" HorizontalContentAlignment="Left">
<ItemsControl.ItemTemplate>
<DataTemplate>
<ListBox Width="Auto" Height="Auto" HorizontalContentAlignment="Left">
<WrapPanel Orientation="Horizontal" Width="Auto" Height="Auto">
<StackPanel Name="stpProduct" Orientation="Vertical">
<TextBlock Width="Auto" Height="Auto" Text="{Binding Nome}" Foreground="#006b66" FontFamily="Verdana" FontSize="14" FontWeight="ExtraBold"/>
<Image Width="400" Height="300" Source="{Binding PathImmagine}"/>
<TextBlock Width="Auto" Height="Auto" Foreground="#006b66" FontFamily="Verdana" FontSize="20" FontWeight="Bold">
<Run Text="Prezzo a partire da: "/>
<LineBreak/>
<Run Text="{Binding Prezzo}"/>
<Run Text="€"/>
</TextBlock>
<TextBlock Width="Auto" Height="Auto" Text="{Binding Rigidita}" Foreground="Gray" FontFamily="Verdana" FontSize="20" FontWeight="ExtraBold"/>
</StackPanel>
</WrapPanel>
</ListBox>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ItemsControl>
</ScrollViewer>
</Grid>
</Grid>
</Window>
I am not sure you are speaking about images, Image1 Image2 Image3. You would have mentioned them in the given code snippet. As I am not sure about the ques, I have added 2 scenarios.
Scenario 1: I could see 3 Image control in the 0th Column. If you need them to be shown horizontally, you could use StackPanel instead of Grid, and can use the Orientation property as Horizontal. or you need to add 3 columns to the 0th Column Grid, and you can add those images respectively.
Scenario 2: and in the 1st Grid, you have a scrollviewer, if you need the image controls to be visible horizontally inside those, the same you could use the Orientation property of StackPanel (stackpanel inside the wrappanel) to Horizontal instead of Vertical.
Hope this helps you.
<ScrollViewer HorizontalScrollBarVisibility="Visible">
<StackPanel Orientation="Horizontal">
<Button Content="Button1" Foreground="Red" />
<Button Content="Button2" Foreground="Red" />
<Button Content="Button3" Foreground="Red" />
<Button Content="Button4" Foreground="Red" />
<Button Content="Button5" Foreground="Red" />
<Button Content="Button6" Foreground="Red" />
</StackPanel>
</ScrollViewer>
Try this way, adding a custom panel template to your listbox that is horizontal.
<Window x:Class="TESSTTTTTT.MirrorWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MirrorWindow" HorizontalAlignment="Center" VerticalAlignment="Center" WindowStyle="None">
<Grid Name="grid2" HorizontalAlignment="Center" VerticalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" Name="ColumnKinect">
<Image Name="camera2" Height="1800" Width="3200" HorizontalAlignment="Center" VerticalAlignment="Center"/>
<!--
<Canvas Name="canvas2" Height="1800" Width="3200" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden" />-->
<Image Name="imgBodyFrame" Source="{Binding MainWindow.ImageSource}" Height="1800" Width="3200"/>
<!--Stretch="UniformToFill"-->
<Image Name="img3DBodyRotation" Source="{Binding MainWindow.ImageSource}" Height="1800" Width="3200" Visibility="Hidden"/>
</Grid>
<Grid Grid.Column="1" Height="1800" Width="3200" HorizontalAlignment="Stretch" VerticalAlignment="Top" Name="ColumnCatalogo">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="0" Name="scrollViewerCatalogo" Background="AliceBlue"
HorizontalScrollBarVisibility="Visible"
VerticalScrollBarVisibility="Visible">
<ItemsControl Grid.Row="0" Name="itemsControl" HorizontalAlignment="Center" VerticalAlignment="Stretch">
<ItemsControl Name="itcCatalogo" HorizontalContentAlignment="Left">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<ListBox Width="Auto" Height="Auto" HorizontalContentAlignment="Left">
<WrapPanel Orientation="Horizontal" Width="Auto" Height="Auto">
<StackPanel Name="stpProduct" Orientation="Vertical">
<TextBlock Width="Auto" Height="Auto" Text="{Binding Nome}" Foreground="#006b66" FontFamily="Verdana" FontSize="14" FontWeight="ExtraBold"/>
<Image Width="400" Height="300" Source="{Binding PathImmagine}"/>
<TextBlock Width="Auto" Height="Auto" Foreground="#006b66" FontFamily="Verdana" FontSize="20" FontWeight="Bold">
<Run Text="Prezzo a partire da: "/>
<LineBreak/>
<Run Text="{Binding Prezzo}"/>
<Run Text="€"/>
</TextBlock>
<TextBlock Width="Auto" Height="Auto" Text="{Binding Rigidita}" Foreground="Gray" FontFamily="Verdana" FontSize="20" FontWeight="ExtraBold"/>
</StackPanel>
</WrapPanel>
</ListBox>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ItemsControl>
</ScrollViewer>
</Grid>
</Grid>
</Window>

forcing scrollbars to appear in listbox

Hi can I force scrollbars to appear in listbox when its content do not fit. I really need it.
To create tabcontrol item I concucted this xaml:
<TabControl.ContentTemplate>
<DataTemplate>
<ScrollViewer VerticalScrollBarVisibility="Visible"
HorizontalScrollBarVisibility="Visible">
<Grid Name="RssFeedContainerGrid" >
<Grid.RowDefinitions>
<RowDefinition Height="20" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<controls:ucRssFeed Grid.Row="1" RssUri="{Binding FeedUri}" />
</Grid>
</ScrollViewer>
</DataTemplate>
</TabControl.ContentTemplate>
and ucRssFeed contains listbox.
Here some xaml from that control where I want scrolling to take place:
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="10" x:Name="RssFeedCellblock">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Orientation="Vertical" Margin="10" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="0">
<!-- Topic label-->
<TextBlock Cursor="Hand" FontWeight="Bold" Text="{Binding XPath=title}" Tag="{Binding XPath=link}" Foreground="{StaticResource RSS_Topic_Title}" MouseDown="TextBlock_MouseDown">
</TextBlock>
<!-- Breakline -->
<Line Stroke="{StaticResource RSS_Topic_Title}" Y1="5" Y2="5" X1="0" X2="{Binding ElementName=NewsListBox, Path=ActualWidth}" Opacity="0.7" StrokeThickness="1"/>
<!-- publication date label -->
<TextBlock Text="{Binding XPath=pubDate}" Opacity="0.5" />
<!-- Description textblock -->
<TextBlock FontSize="10" FontFamily="Times New Roman" x:Name="descriptionTextBlock"
Text="{Binding XPath=description, Converter={StaticResource HtmlToPlainTextConverter}}" Margin="10"
TextWrapping="Wrap" />
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
You need to set the Height property of your ListBox for the Scrollbar to appear listbox automatically show scrollbar when the content is more

Setting a relative column width in XAML. '0.5*' string cannot be converted to Length

Here's the XAML:
<ListBox Grid.Row="1" x:Name="lstGames" Background="#343434" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid ShowGridLines="True">
<Grid.ColumnDefinitions>
<ColumnDefinition MaxWidth="0.5*"/> //<-----------HERE!
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Image Grid.Row="0" Grid.Column="0" Source="{Binding ImageUrl}" Stretch="UniformToFill"/>
<StackPanel Grid.Row="0" Grid.Column="1">
<StackPanel Orientation="Horizontal">
<TextBlock Text="Title:" />
<TextBlock Text="{Binding Title}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Release Date:" />
<TextBlock Text="{Binding ReleaseDate}" />
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
All I want is for the first column to at most be around 35% of the total width of the window. I was under the impression that this notation was allowed, but something is wrong and I'm getting that exception fired.
Any suggestions?
If I change it to only Width="0.5*" then it compiles and runs, but still doesn't give the pictures (the columns) a uniform width:
ColumnDefinition.MaxWidth is a double, not a GridLength. So it can't be a relative value. However, since it's a dependency property, you might be able to bind it to the total width of the window, using a converter with a parameter.

Last Grid Column Not Auto Resizing With Grid

I'm having a problem with my TextBoxs not "Auto" resizing. I'm trying to create a form that behaves and looks like the Properties Editor in Visual Studio. What appears to be happening is that the third column is not expanding to fill all of the available remaining space in the grid. Image below is how my form looks on startup.
The width of the textboxs is determined by the MinWidth setting on the third ColumnDefinition statement. Also, the Width is set to "*". With any other setting, the resizing done with the GridSplitter doesn't work correctly.
<StackPanel Orientation="Vertical" VerticalAlignment="Top" x:Name="Stacker" Grid.IsSharedSizeScope="True">
<Expander x:Name="Expand" IsExpanded="True" Header="This is a test of a Second Panel" Width="{Binding Width, ElementName=Stacker}">
<Grid x:Name="EditGrid1" Margin="3" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" MinWidth="50" SharedSizeGroup="SharedSize1" />
<ColumnDefinition Width="Auto" SharedSizeGroup="SharedSize2" />
<ColumnDefinition Width="*" MinWidth="50" x:Name="ValueCol" />
</Grid.ColumnDefinitions>
<GridSplitter Grid.Column="1" x:Name="ToolBoxSplitter1" Grid.Row="1" Grid.RowSpan="6" Panel.ZIndex="1" HorizontalAlignment="Stretch" ResizeBehavior="PreviousAndNext" Width="3"/>
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="1" Text="{x:Static lex:DoSomeThingView.Name}" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="2" Text="{x:Static lex:DoSomeThingView.Address}" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="3" Text="{x:Static lex:DoSomeThingView.Zip}" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="4" Text="{x:Static lex:DoSomeThingView.NumberOfDoors}" TextTrimming="CharacterEllipsis" Grid.IsSharedSizeScope="True" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="5" Text="{x:Static lex:DoSomeThingView.DoubleNumber}" />
<TextBox Grid.Column="2" Grid.Row="1" x:Name="UserName1" MaxHeight="50" TextWrapping="Wrap"
VerticalScrollBarVisibility="Auto" SpellCheck.IsEnabled="True" />
<TextBox Grid.Column="2" Grid.Row="2" x:Name="Address1" />
<TextBox Grid.Column="2" Grid.Row="3" x:Name="Zip1" />
<TextBox Grid.Column="2" Grid.Row="4" x:Name="NumberOfDoors1" />
<TextBox Grid.Column="2" Grid.Row="5" x:Name="DoubleNumber1" />
</Grid>
</Expander>
</StackPanel>
Any suggestions on how to correct this?
Have a check once again of any style being set globally because your layout worked perfectly fine with me.
try overriding your textbox style by a local resource
<StackPanel.Resources>
<Style TargetType="{x:Type TextBox}"/>
</StackPanel.Resources>

WPF ListBox: how to update data with binding

I have listbox that displays information about list of objects:
<ListBox Grid.Column="0" Height="152" Name="CustomersList" HorizontalAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Name, Mode=OneWay}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I would show more detailed information about selected item in another block, but I don't know (and can't find) how to bind selected item to those block data context. I guess it should be something like this:
<Grid Grid.Column="1" DataContext="{Binding Path=ItemSelected, UpdateSourceTrigger=PropertyChanged}" VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="250"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Text="Id" VerticalAlignment="Center" />
<TextBox Grid.Row="0" Grid.Column="1" Text="{Binding Path=Id}" VerticalAlignment="Center"/>
<TextBlock Grid.Row="1" Grid.Column="0" Text="Name" VerticalAlignment="Center"/>
<TextBox Grid.Row="1" Grid.Column="1" Text="{Binding Path=Name}" VerticalAlignment="Center"/>
<StackPanel Grid.Row="2" Grid.ColumnSpan="2" Orientation="Horizontal" HorizontalAlignment="Center">
<Button Content="Add new" />
<Button Content="Store changes" />
</StackPanel>
</Grid>
But the problem is that data item to be binded to the grid is not specified anywhere and I don't know how to do that.
Any suggestion would be wellcome.
Thanks!
P.S. I've tried to specify CustomersList.ItemsSource as DataContext for the Grid - this didn't give any result.
You can bind to the SelectedItem property of the ListBox, one way is using ElementName.
<Grid DataContext="{Binding ElementName=CustomersList, Path=SelectedItem}"> </Grid>

Resources