CODEWITHSUNDEEP
c#wpfxamlcustom-controls
linus72982
linus72982

Reputation: 1393

Horizontal alignment in control seems to be ignored on all but the last item

I have a custom radio button based on togglebutton:

<Style TargetType="{x:Type local:ToolbarRadioButton}" BasedOn="{StaticResource {x:Type ToggleButton}}">
   <Setter Property="Width" Value="60"/>
   <Setter Property="Height" Value="60"/>
   <Setter Property="ContentTemplate">
       <Setter.Value>
           <DataTemplate>
               <StackPanel Orientation="Vertical">
                   <iconPacks:PackIconModern Kind="{Binding TbIcon, RelativeSource={RelativeSource AncestorType=RadioButton}}"
                                             Height="30" Width="35" HorizontalAlignment="Center"/>
                   <TextBlock Text="{Binding TbText, RelativeSource={RelativeSource AncestorType=RadioButton}}" FontSize="12"
                              HorizontalAlignment="Center"/>
               </StackPanel>
           </DataTemplate>
       </Setter.Value>
   </Setter>
</Style>

I use this control to create four toggle/radio buttons. I've horizontal centered the items in datatemplate, but I end up with this:

enter image description here

Forecast and its icon seem to be centered, but the others are partially left-aligned. They all use the same control so shouldn't they all be centered?

EDITS FOR CLARITY: It doesn't matter which order I put them in, Forecast is always the one that's aligned correctly. There is no whitespace in the text nor is there whitespace in the images and all images are sized according to the control defined above. Here's the implementation portion in case it's useful, though they're all the exact same:

<StackPanel Orientation="Horizontal" Grid.Column="0" Grid.Row="0">
    <customs:ToolbarRadioButton TbText="Day" TbIcon="CalendarDay" GroupName="calViewType" x:Name="dayOnOff"/>
    <customs:ToolbarRadioButton TbText="Week" TbIcon="CalendarWeek" GroupName="calViewType" x:Name="weekOnOff"/>
    <customs:ToolbarRadioButton TbText="Month" TbIcon="CalendarMonth" GroupName="calViewType" x:Name="monthOnOff" IsChecked="True"/>
    <customs:ToolbarRadioButton TbText="Forecast" TbIcon="PeopleMultiple" GroupName="calViewType" x:Name="forecastOnOff"/>
</StackPanel>

Upvotes: 1

Views: 258

Answers (1)

linus72982
linus72982

Reputation: 1393

For future readers: I figured out the answer by digging into the documentation on Button. There is a property on buttons called HorizontalContentAlignment (and vertical, of course) that apparently needs to be set to align the visual content. You can't set the HorizontalAlignment property of the item that is the content explicitly; apparently, the button wants to do that for you.

Upvotes: 2

Related Questions