Question

I’m looking for an easy way to synchronize Text sizes (Button Content), which are generated by an ItemsControl.

I’m using the following Xaml code:

<ItemsControl ItemsSource="{Binding UseCases}">
 <ItemsControl.ItemsPanel>
  <ItemsPanelTemplate>
   <WrapPanel />
  </ItemsPanelTemplate>
 </ItemsControl.ItemsPanel>
 <ItemsControl.ItemTemplate>
  <DataTemplate>
   <Button Content="{Binding DisplayName}" Width="200" Height="200">
    <Button.ContentTemplate>
     <DataTemplate>
      <Viewbox>
       <ContentPresenter Content="{Binding}" />
      </Viewbox>
     </DataTemplate>
    </Button.ContentTemplate>
   </Button>
  </DataTemplate>
 </ItemsControl.ItemTemplate>
</ItemsControl>

I want to make the text on the buttons as big as possible, which already works.
But since the text length is different, the text sizes for each button is also different, which looks odd.
Is there a simple way to tell the Viewbox (or any other way) to take the size of the smallest text and use it for every button?

Answer 1

to limit the size of text just use Padding:

Handling text overflow is the complex part. By some reason (the culprit is – ButtonChrome) the button won’t take ‘TextBlock.TextTrimmingProperty’ attached property, however the AttachedProperty mechanism is designed specifically for the cases like that), leaving you with two options:

1. Override button’s template, lookup for ButtonChrome, get rid of it and replace with something, which has a TextBlock, bind that TextBlock’s text to ContentControl.Content.

2. Manage your text overflow by yourself. Sibscribe for SizeChanged event, get size from the event argument (it mightn’t be available anywhere else), get the padding and figure out if text exceeds the available size. Replace the excessive part of it with “..”.

The moral – not worth doing.

I’d create uniform quadratic launch buttons and put labels beside them.