單選按鈕頂部對齊子彈

我有一個單選按鈕，其中有一個文本塊。文本塊中的文本跨越多行。發生這種情況時，子彈集中在文本上，但我希望它與頂部對齊。我假設我需要重寫屬性，但我似乎無法弄清楚。

這裏是我的單選按鈕的XAML。關於如何讓項目符合文字頂部而不居中的任何想法？

<RadioButton x:Name="RadioButton1" Background="#BFD0A225" Margin="0,-12,0,-13" Checked="itsChecked" FontSize="32"> 
    <TextBlock x:Name="TextBlockText" TextWrapping="Wrap"> 
     <Run Text="This is line 1."/> 
     <LineBreak/> 
     <Run Text="This is line 2."/> 
     <LineBreak /> 
     <Run Text="This is line 3."/> 
    </TextBlock> 
</RadioButton>

來源

2011-04-21 Brian

您可以嘗試將這種風格應用到您的單選按鈕嗎？

<RadioButton x:Name="RadioButton1" Background="#BFD0A225" FontSize="32" Style="{StaticResource RadioButtonStyle1}"> 





    <Style x:Key="PhoneButtonBase" TargetType="ButtonBase"> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/> 
     <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/> 
     <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/> 
     <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/> 
     <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/> 
     <Setter Property="Padding" Value="10,3,10,5"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="ButtonBase"> 
        <Grid Background="Transparent"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="MouseOver"/> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}"> 
          <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Border> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <Style x:Key="PhoneRadioButtonCheckBoxBase" BasedOn="{StaticResource PhoneButtonBase}" TargetType="ToggleButton"> 
     <Setter Property="Background" Value="{StaticResource PhoneRadioCheckBoxBrush}"/> 
     <Setter Property="BorderBrush" Value="{StaticResource PhoneRadioCheckBoxBrush}"/> 
     <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMedium}"/> 
     <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}"/> 
     <Setter Property="HorizontalContentAlignment" Value="Left"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="0"/> 
    </Style> 
    <Style x:Key="RadioButtonStyle1" BasedOn="{StaticResource PhoneRadioButtonCheckBoxBase}" TargetType="RadioButton"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="RadioButton"> 
        <Grid Background="Transparent"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="MouseOver"/> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="EnabledCheckBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Collapsed</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PressedDarkCheckBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PressedLightCheckBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="CheckMark"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneRadioCheckBoxCheckBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="EnabledCheckBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Collapsed</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DisabledDarkCheckBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DisabledLightCheckBackground"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="CheckMark"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneRadioCheckBoxCheckDisabledBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="CheckStates"> 
           <VisualState x:Name="Checked"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="CheckMark"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Unchecked"/> 
           <VisualState x:Name="Indeterminate"/> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="ValidationStates"> 
           <VisualState x:Name="Valid"/> 
           <VisualState x:Name="InvalidFocused"/> 
           <VisualState x:Name="InvalidUnfocused"/> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="FocusStates"> 
           <VisualState x:Name="Focused"/> 
           <VisualState x:Name="Unfocused"/> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Grid Margin="{StaticResource PhoneTouchTargetLargeOverhang}"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="32"/> 
           <ColumnDefinition Width="*"/> 
          </Grid.ColumnDefinitions> 
          <Grid x:Name="Radio" VerticalAlignment="Top" Margin="0,10,0,0"> 
           <Ellipse x:Name="EnabledCheckBackground" Fill="{TemplateBinding Background}" HorizontalAlignment="Left" Height="32" IsHitTestVisible="False" VerticalAlignment="Center" Width="32"/> 
           <Canvas HorizontalAlignment="Left" Height="32" IsHitTestVisible="False" Opacity="{StaticResource PhoneDarkThemeOpacity}" VerticalAlignment="Center" Width="32"> 
            <Ellipse x:Name="PressedDarkCheckBackground" Fill="{StaticResource PhoneRadioCheckBoxPressedBrush}" Height="32" Visibility="Collapsed" Width="32"/> 
            <Ellipse x:Name="DisabledDarkCheckBackground" Fill="{StaticResource PhoneRadioCheckBoxDisabledBrush}" Height="32" Visibility="Collapsed" Width="32"/> 
           </Canvas> 
           <Canvas HorizontalAlignment="Left" Height="32" IsHitTestVisible="False" Opacity="{StaticResource PhoneLightThemeOpacity}" VerticalAlignment="Center" Width="32"> 
            <Ellipse x:Name="PressedLightCheckBackground" Fill="{StaticResource PhoneRadioCheckBoxPressedBrush}" Height="32" Stroke="{StaticResource PhoneForegroundBrush}" StrokeThickness="{StaticResource PhoneStrokeThickness}" Visibility="Collapsed" Width="32"/> 
            <Ellipse x:Name="DisabledLightCheckBackground" Fill="{StaticResource PhoneRadioCheckBoxDisabledBrush}" Height="32" Stroke="{StaticResource PhoneDisabledBrush}" StrokeThickness="{StaticResource PhoneStrokeThickness}" Visibility="Collapsed" Width="32"/> 
           </Canvas> 
           <Ellipse x:Name="CheckMark" Fill="{StaticResource PhoneRadioCheckBoxCheckBrush}" HorizontalAlignment="Center" Height="16" IsHitTestVisible="False" VerticalAlignment="Center" Width="16" Visibility="Collapsed"/> 
          </Grid> 
          <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="1" Foreground="{TemplateBinding Foreground}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="12,0,0,0" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Grid> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style>

來源

2011-04-21 01:56:08

這是非常接近的。謝謝！我看到的唯一問題是選中的單選按鈕中的點有點太低。我可以使用上面的XAML的哪一部分來調整它一點點？ – Brian 2011-04-21 03:40:30

對不起，我不小心。我只是編輯風格，現在它應該工作正常。你應該看的地方是一個名爲'Radio'的網格。希望這可以幫助。 :) – 2011-04-21 03:58:19

完美的作品。謝謝！ – Brian 2011-04-21 04:31:45

您不需要修改默認控件就可以做到這一點。簡單地定製餘量爲TextBlock控制所使用的RadioButton內：

<RadioButton x:Name="RadioButton1" Background="#BFD0A225" Margin="0,-12,0,-13" Checked="itsChecked" FontSize="32"> 
    <TextBlock Margin="0,90,0,0" x:Name="TextBlockText" TextWrapping="Wrap"> 
     <Run Text="This is line 1."/> 
     <LineBreak/> 
     <Run Text="This is line 2."/> 
     <LineBreak /> 
     <Run Text="This is line 3."/> 
    </TextBlock> 
</RadioButton>

來源

2011-04-21 03:37:11

啊，這是有道理的。謝謝！現在我已經實施了，現在我會堅持使用另一個。 – Brian 2011-04-21 04:33:34

單選按鈕頂部對齊子彈

回答

相關問題