Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>If I understand correctly. You want to show buttons with Text and an Image, but if the width of the button is reduced to a certain size, it will only show the image.</p> <p>If so, you should be able to implement with a datatrigger.</p> <pre><code>&lt;Window x:Class="StackOverflow1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:StackOverflow1" Title="MainWindow" Height="350" Width="525"&gt; &lt;Window.Resources&gt; &lt;local:isLessThanConverter x:Key="MyisLessThanConverter"/&gt; &lt;Style x:Key="myWidthTrigger" TargetType="TextBlock"&gt; &lt;Style.Triggers&gt; &lt;DataTrigger Binding="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType=Button}, Converter={StaticResource MyisLessThanConverter}, ConverterParameter=90}" Value="True"&gt; &lt;Setter Property="Visibility" Value="Collapsed" /&gt; &lt;/DataTrigger&gt; &lt;/Style.Triggers&gt; &lt;/Style&gt; &lt;/Window.Resources&gt; &lt;Grid&gt; &lt;Grid.ColumnDefinitions&gt; &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt; &lt;ColumnDefinition Width="Auto"&gt;&lt;/ColumnDefinition&gt; &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt; &lt;/Grid.ColumnDefinitions&gt; &lt;ListView HorizontalContentAlignment="Stretch"&gt; &lt;Button x:Name="myButton" Width="Auto"&gt; &lt;StackPanel Orientation="Horizontal"&gt; &lt;TextBlock x:Name="MyTextBlock" Style="{StaticResource myWidthTrigger}" Text="Test"&gt;&lt;/TextBlock&gt; &lt;Image Source="image.png" Height="15"&gt;&lt;/Image&gt; &lt;/StackPanel&gt; &lt;/Button&gt; &lt;/ListView&gt; &lt;GridSplitter Width="5" Grid.Column="1" ResizeDirection="Columns" ResizeBehavior="PreviousAndNext"&gt;&lt;/GridSplitter&gt; &lt;/Grid&gt; </code></pre> <p></p> <p>Also using this IValueConvertor:</p> <pre><code>[ValueConversion(typeof(double), typeof(string))] public class isLessThanConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { if ((double)value &lt; double.Parse((string)parameter)) { return true; } else { return false; } } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } } </code></pre> <p>I am not an expert at this, so there may be a cleaner way. I also used a listview instead of your requested wrappanel.</p> <p>Hope this helps</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload