StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>You can use a second converter to bind the style.</p> <p>Create a IMultiValueConverter that takes two values, ActualWidth and the element that the calculations will be based on (in my example, I am using Window):</p> <pre><code>class ImageButtonStyleSelectorConverter : IMultiValueConverter { #region IMultiValueConverter Members public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture) { Double actualWidth = values[0] as Double? ?? 0; FrameworkElement element = values[1] as FrameworkElement; if (element != null) { // perform calculations and return button size (using even/odd for illustration purposes) if (element.Width % 2 == 0) { return element.Resources["MultiResButton_Small"]; } else { return element.Resources["MultiResButton_Big"]; } } return Binding.DoNothing; } public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture) { throw new NotImplementedException(); } #endregion } </code></pre> <p>Then, change your button to use the converter to choose the style:</p> <pre><code> <Button> <Button.Style> <MultiBinding Converter="{StaticResource ImageButtonStyleSelectorConverter}" FallbackValue="{StaticResource MultiResButton_Big}"> <Binding RelativeSource="{RelativeSource AncestorType=Window, Mode=FindAncestor}" Path="ActualWidth"/> <Binding RelativeSource="{RelativeSource AncestorType=Window, Mode=FindAncestor}" Path="."/> </MultiBinding> </Button.Style> <StackPanel> <Image Tag="Multi.png" /> <TextBlock Text="Button Text" /> </StackPanel> </Button> </code></pre> <p>I added the FallbackValue because otherwise, I could not see either style from design view.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

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