增加單選按鈕的命中大小

我已經使用了Windows Forms多年，但我對WPF比較陌生。我有一些沒有標籤的單選按鈕（標籤位於列的頂部，不用擔心它們！該程序將在平板電腦上運行，因此我希望使單選按鈕的命中區域儘可能大如可能，我還需要單選按鈕來在他們的行和列的中心增加單選按鈕的命中大小

我能得到我想要加入這個到我的網格中的每一列的外觀：

<Label Name="connectedLabel" Grid.Column="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"> 
    <RadioButton x:FieldModifier="private" Name="connectedRadioButton" Grid.Column="2" Checked="otherRadioButton_CheckedChanged" Unchecked="otherRadioButton_CheckedChanged"></RadioButton> 
</Label>

剛剛在填充網格部分的標籤中居中放置一個單選按鈕。
顯然，行爲是錯誤的（雖然事件沒有通過，您可以在同一行上選擇多個單選按鈕等）

這將是Winforms中的蛋糕，我希望在WPF中有一個簡單的解決方案。

任何人都可以幫忙嗎？

編輯：橙色區域是單選按鈕的默認命中區域，綠色區域是我想要的命中區域。到目前爲止，這是在沒有大量的定製佈線單選按鈕的

enter image description here

來源

2011-08-31 Justin Doyle

您是否嘗試過拉伸特性？您是否嘗試過在單選按鈕本身設置屬性，如內容對齊？您的網格是否在任何一種面板內（因爲這會拉伸）？你嘗試過邊框而不是標籤嗎？ –

嗨Merlyn，是的，我試過拉伸屬性，我已經嘗試了單選按鈕本身的所有可能屬性（包括內容對齊）。網格直接在我的用戶控制之下（該用戶控件隨後被添加到項目面板，但這確實不成問題？）。邊框不允許內容對齊，這會在左上角留下單選按鈕。 –

現在你已經獲得了屏幕截圖的問題+1。這使得它更清楚你在找什麼。 –

編輯有問題的新照片。

如果你不介意額外的輸入，你可以使用這個：

 <Style TargetType="RadioButton" x:Key="rb"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="RadioButton"> 
         <Grid> 
          <RadioButton IsChecked="{Binding Path=IsChecked, RelativeSource={RelativeSource Mode=TemplatedParent}}" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
          <Border Background="Transparent" /> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style>

可正常工作在我的小測試程序：

<Grid> 
    <Grid.Resources> 
     <Style TargetType="RadioButton" x:Key="rb"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="RadioButton"> 
         <Grid> 
          <RadioButton IsChecked="{Binding Path=IsChecked, RelativeSource={RelativeSource Mode=TemplatedParent}}" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
          <Border Background="Transparent" /> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

     <Style TargetType="ListBoxItem" x:Key="ics"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="ListBoxItem"> 
         <Grid ShowGridLines="True"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition /> 
           <ColumnDefinition /> 
           <ColumnDefinition /> 
           <ColumnDefinition /> 
          </Grid.ColumnDefinitions> 

          <RadioButton HorizontalAlignment="Center" VerticalAlignment="Center" /> 
          <RadioButton HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1" /> 
          <RadioButton Style="{StaticResource rb}" Grid.Column="2" /> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Grid.Resources> 

    <ListBox ItemContainerStyle="{StaticResource ics}"> 
     <ListBoxItem>1</ListBoxItem> 
    </ListBox> 
</Grid>

它看起來像：

enter image description here

（顯然你會想要使用提供的第三種方法）

我知道這看起來不多，但它會給你你的結果。再次，請原諒額外的打字和缺乏使用的編碼標準。

爲此，鼠標懸停不會給視覺效果，但命中測試是有效的。我認爲只要這是在平板電腦上，並且不跟蹤手指，就可以。

如果你只是想控制，以更大的尺寸，你可以使用以下方法

您可以通過RenderTransform屬性設置爲ScaleTransform對象調整控制。

：

調整所有RadioButton容器（窗口，網頁，電網等）

<Window.Resources> 
    <Style TargetType="RadioButton"> 
     <Setter Property="RenderTransform"> 
      <Setter.Value> 
       <ScaleTransform ScaleX="10" ScaleY="10"/> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources>

或全部關鍵

<Style TargetType="RadioButton" x:Key="resizeRadioButton"> 
     <Setter Property="RenderTransform"> 
      <Setter.Value> 
       <ScaleTransform ScaleX="10" ScaleY="10"/> 
      </Setter.Value> 
     </Setter> 
    </Style>

使用中的對象

<RadioButton Style="{StaticResource resizeRadioButton}" />

或單獨

<RadioButton> <RadioButton.RenderTransform> <ScaleTransform ScaleX="10" ScaleY="10"/> </RadioButton.RenderTransform> </RadioButton>

然而，如果你要使用更大的控制和更大的點擊區域（或一組類型的所有控件只是更大的點擊區域）的組合，可以使用方法：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Style TargetType="RadioButton"> <Setter Property="RenderTransformOrigin" Value="0.5,0.5" /> <Setter Property="HorizontalAlignment" Value="Center" /> <Setter Property="VerticalAlignment" Value="Center" /> <Setter Property="RenderTransform"> <Setter.Value> <ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="1.5" ScaleY="1.5"/> </Setter.Value> </Setter> <Setter Property="Content"> <Setter.Value> <Border> <Rectangle Margin="-10" Fill="Transparent" /> </Border </Setter.Value> </Setter> </Style> </ResourceDictionary>

或者只是使用另一個容器內的控件的默認行爲，並使用HorizontalAlignment="Stretch"道具不過，這會讓我相信左上角的控制權。

來源

2011-08-31 05:50:59 fatty

@Justin - ...而且，你不需要標籤。在RadioButton上使用'HorizontalAlignment ='Center'VerticalAlignment =「Center」'。此外，stukselbax波紋管，有一個關於'GroupName'的重要信息。 – XAMeLi

@XAMeLi謝謝，我知道我不應該需要這個標籤，這是一個黑客攻擊，我只想給我一些想法。我不認爲這是一個可以接受的解決方案，因爲我必須連接鼠標懸停和點擊事件。我一直被別的atm所誤導。我很快就會回來 –

關於這個答案，雖然對於一般意義上的知識非常有用，但並不是我所追求的。我希望單選按鈕上的點擊框變大，我不想要一個更大的單選按鈕。感謝您的建議，雖然 –

GroupName屬性應該幫助尋找不可能的。將它設置在每個RadioButton中相同，hf！

<RadioButton GroupName="MyGroup1"> 
<RadioButton GroupName="MyGroup1"> 
<RadioButton GroupName="MyGroup1"> 
<RadioButton GroupName="MyGroup2"> 
<RadioButton GroupName="MyGroup2"> 
<RadioButton GroupName="MyGroup3">

每組將按預期工作。組中只有一個RadioButton將被檢查。

來源

2011-08-31 05:49:55 stukselbax

謝謝sukselbax，這對知道甚至可能是一個部分解決方案非常有用，但我真正想要的是增加單選按鈕周圍的空白。在Winforms中，我只關閉autosize，將'checkbox'居中並停靠整個事物。我只需要一個WPF相當於 –

[我只是添加脂肪時和stukselbax的解決方案]

看來，你需要改變單選按鈕的Template。 Bellow是默認的Aero（Win7）風格，帶有修改過的模板，請參閱代碼中的註釋。要使代碼正常工作，請添加以下命名空間：xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"並確保您參考了PresentationFramework.Aero.dll程序集。

<Style x:Key="CheckRadioFocusVisual"> 
    <Setter Property="Control.Template"> 
     <Setter.Value> 
      <ControlTemplate> 
       <Rectangle Margin="14,0,0,0" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<Style TargetType="{x:Type RadioButton}"> 
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
    <Setter Property="Background" Value="#F4F4F4"/> 
    <Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/> 
    <Setter Property="BorderThickness" Value="1"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type RadioButton}"> 
       <BulletDecorator Background="Transparent"> 
        <BulletDecorator.Bullet> 
         <Grid> 
          <!--This is where you decide about the size of the hit area, the Border bellow has to be transparent and it's acting as the hit area. The Width and Height on the BulletChrome is a modification to bring the size of the bullet back to original size (or close to it)--> 
          <Border Background="Transparent" Width="50" Height="50"/> 
          <Microsoft_Windows_Themes:BulletChrome Width="20" Height="20" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" IsChecked="{TemplateBinding IsChecked}" IsRound="true" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"/> 
         </Grid> 
        </BulletDecorator.Bullet> 
        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
       </BulletDecorator> 
       <ControlTemplate.Triggers> 
        <Trigger Property="HasContent" Value="true"> 
         <Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}"/> 
         <Setter Property="Padding" Value="4,0,0,0"/> 
        </Trigger> 
        <Trigger Property="IsEnabled" Value="false"> 
         <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>

來源

2011-09-05 08:58:05 XAMeLi

增加單選按鈕的命中大小

回答

相關問題