2017-06-07 37 views
0

我試圖做一個單選按鈕模板將如下所示: enter image description here獲取文本的單選按鈕模板對準

這裏是我加入的模板:

<Style 
     x:Key="MainWindowTemplateConfigurationWindowRadioButtonStyle" 
     TargetType="RadioButton" 
     BasedOn="{StaticResource MainWindowRadioButtonImageStyle}"> 
     <Setter 
      Property="Margin" 
      Value="3,3" /> 
     <Setter 
      Property="Template"> 
      <Setter.Value> 
       <ControlTemplate 
        TargetType="{x:Type RadioButton}"> 
        <Border BorderThickness="2" BorderBrush="{StaticResource BRInactiveItemBackgroundBrush}" > 
         <StackPanel x:Name="Panel" Background="{StaticResource ControlsLightBorderBrush}" VerticalAlignment="Stretch" 
            > 
          <TextBlock x:Name="ButtonText" TextAlignment="Center" FontSize="25" Padding="7,7" VerticalAlignment="Center" 
             /> 
         </StackPanel> 
        </Border> 
        <ControlTemplate.Triggers> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.SystemConfiguration}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="True" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource SystemConfigurationRadioButton}" /> 
          <Setter 
           Property="Background" 
           TargetName="Panel" 
           Value="{StaticResource BRInactiveItemBackgroundBrush}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.SystemConfiguration}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="False" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource SystemConfigurationRadioButton}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.PlateSetup}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="True" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource PlateSetup}" /> 
          <Setter 
           Property="Background" 
           TargetName="Panel" 
           Value="{StaticResource BRInactiveItemBackgroundBrush}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.PlateSetup}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="False" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource PlateSetup}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.ThermalCyclingProtocol}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="True" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource ThermalProtocol}" /> 
          <Setter 
           Property="Background" 
           TargetName="Panel" 
           Value="{StaticResource BRInactiveItemBackgroundBrush}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.ThermalCyclingProtocol}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="False" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource ThermalProtocol}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.Reports}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="True" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource ReportsRadioButton}" /> 
          <Setter 
           Property="Background" 
           TargetName="Panel" 
           Value="{StaticResource BRInactiveItemBackgroundBrush}" /> 
         </MultiDataTrigger> 
         <MultiDataTrigger> 
          <MultiDataTrigger.Conditions> 
           <Condition 
            Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" 
            Value="{x:Static views:DisplayModes.Reports}"/> 
           <Condition 
            Binding="{Binding IsChecked, RelativeSource={RelativeSource Self}}" 
            Value="False" /> 
          </MultiDataTrigger.Conditions> 
          <Setter 
           Property="Text" 
           TargetName="ButtonText" 
           Value="{StaticResource ReportsRadioButton}" /> 
         </MultiDataTrigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

然而,我得到的結果是這樣的: enter image description here

我試着玩StackPanel和TextBlock之間的所有屬性來對齊文本單選按鈕的中心,但是當我這樣做的時候,我得到了文本集中對齊的結果,但是內容不適合填充單選按鈕的空間。我不能附加任何更多的圖像,因爲我沒有足夠的聲譽,道歉...

我實際上通過改變StackPanel的VerticalAlignment從中心拉伸,但它不填充整個區域正確。我強制每個RadioButton的高度都是我使用此風格的高度,與最高按鈕的高度相同(即熱縮圓柱協議的高度),並且我似乎無法弄清楚如何使兩個文本都居中並在同一時間填寫額外的高度...

任何幫助,將不勝感激。 這裏是我如何擺出單選按鈕,如果有幫助:

<Grid Margin="5,5"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 
     <Grid Grid.Column="0" > 
      <Grid> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto"/> 
        <RowDefinition Height="*"/> 
       </Grid.RowDefinitions> 
       <Grid Grid.Row="0" > 
        <Grid.RowDefinitions> 
         <RowDefinition SharedSizeGroup="A"/> 
         <RowDefinition SharedSizeGroup="A"/> 
         <RowDefinition SharedSizeGroup="A"/> 
         <RowDefinition SharedSizeGroup="A"/> 
         <RowDefinition Height="*"/> 
        </Grid.RowDefinitions> 
        <RadioButton Grid.Row="0" Style="{StaticResource MainWindowTemplateConfigurationWindowRadioButtonStyle}" 
           HorizontalAlignment="Stretch" 
           Height="{Binding ActualHeight, ElementName=ThermalCyclingProtocolButton}" 
           Tag="{x:Static views:DisplayModes.SystemConfiguration}"> 
        </RadioButton> 
        <RadioButton Grid.Row="1" Style="{StaticResource MainWindowTemplateConfigurationWindowRadioButtonStyle}" 
           HorizontalAlignment="Stretch" 
           Height="{Binding ActualHeight, ElementName=ThermalCyclingProtocolButton}" 
           Tag="{x:Static views:DisplayModes.PlateSetup}"> 
        </RadioButton> 
        <RadioButton Grid.Row="2" Style="{StaticResource MainWindowTemplateConfigurationWindowRadioButtonStyle}" 
           HorizontalAlignment="Stretch" x:Name="ThermalCyclingProtocolButton" 
           Tag="{x:Static views:DisplayModes.ThermalCyclingProtocol}"> 
        </RadioButton> 
        <RadioButton Grid.Row="3" Style="{StaticResource MainWindowTemplateConfigurationWindowRadioButtonStyle}" 
           HorizontalAlignment="Stretch" 
           Height="{Binding ActualHeight, ElementName=ThermalCyclingProtocolButton}" 
           Tag="{x:Static views:DisplayModes.Reports}"> 
        </RadioButton> 
       </Grid> 
      </Grid> 
     </Grid> 
    </Grid> 

回答

1

被一個StackPanel到作爲一個網格改變了面板的模板。這現在已經達到了我期待的效果。