Question

我目前正在尝试创建一个圆形的简单按钮，其反应方式与默认按钮对点击的反应相同（点击默认按钮时，您可以直观地看到反应，颜色会随之变化）的东西）。

我使用Ellipse属性创建了一个圆形按钮。这消除了按钮必须点击的任何反应（就视觉效果而言）。为了实现它，我使用了可视化管理器。我的问题是我无法成功地将两者结合起来。

我该怎么做呢？

是否有一种更简单的方法可以制作一个对点击做出反应的圆形按钮？

理想情况下，我想要使用代码执行此操作，并避免使用我在几个地方提到过的Blend。

以下是XAML中的两个代码段。

只是一个简单的圆形按钮：

<Button Name="bottomCircle" Width="100" Height="100" HorizontalAlignment="Center" VerticalAlignment="Top" Grid.Row="2">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Grid>
                <Ellipse Fill="Blue">
                </Ellipse>
                <ContentPresenter HorizontalAlignment="Center"
                          VerticalAlignment="Center"/>
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

带有“动画”的按钮：

<Button Content="Click Me" x:Name="ClickMe" Background="Blue" Grid.Row="2"  Width="100" Height="100" >
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Grid Background="Transparent">
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualState x:Name="Normal"/>
                        <VisualState x:Name="MouseOver"/>
                        <VisualState x:Name="Pressed">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Black" />
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedHighlightBackground" Storyboard.TargetProperty="Background">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppBarBackgroundThemeBrush}" />
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppBarBackgroundThemeBrush}" />
                                </ObjectAnimationUsingKeyFrames>
                            </Storyboard>
                        </VisualState>
                        <VisualState x:Name="Disabled">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonBackgroundThemeBrush}" />
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Green" />
                                </ObjectAnimationUsingKeyFrames>
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Background">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" /> 
                                </ObjectAnimationUsingKeyFrames> 
                            </Storyboard> 
                        </VisualState> 
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
                <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0" Background="{TemplateBinding Background}">
                    <Border x:Name="PressedHighlightBackground" Background="Transparent">
                        <ContentControl x:Name="ContentContainer" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Padding="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                    </Border>
                </Border>
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

Answer 1

如果您将边框元素的Option Explicit Const TypeBinary = 1 Dim buffer buffer = encodeFileBase64( "file.zip" ) WScript.StdOut.WriteLine( buffer ) Private Function encodeFileBase64( file ) Dim b64 Set b64 = WScript.CreateObject("Microsoft.XMLDOM").CreateElement("tmp") b64.DataType = "bin.base64" Dim outputBuffer Set outputBuffer = WScript.CreateObject("Scripting.Dictionary") With WScript.CreateObject("ADODB.Stream") .Open .Type = TypeBinary .LoadFromFile(file) Dim inputBuffer Do inputBuffer = .Read(3145716) If IsNull( inputBuffer ) Then Exit Do b64.NodeTypedValue = inputBuffer outputBuffer.Add outputBuffer.Count + 1, b64.Text Loop .Close End With encodeFileBase64 = Join(outputBuffer.Items(), vbCrLf) End Function更改为某个较大的数字，那么您将获得一个圆圈：

CornerRadius

（我确实相信你只能使用一个<Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="100" Background="{TemplateBinding Background}"> <Border x:Name="PressedHighlightBackground" Background="Transparent" CornerRadius="100"> <ContentControl x:Name="ContentContainer" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Padding="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/> </Border> </Border>元素。）

此外，使用Border和Storyboard非常麻烦。您可以使用ObjectAnimationUsingKeyFrames代替，这样更容易维护。

要对圈内的点击次数和仅限作出反应，请移除外部VisualState.Setters，但无论如何都不会提供任何内容。此外，请注意，如果您重命名Grid，视觉状态MouseOver的效果会更好。

这可以按您的方式工作：

PointerOver

Windows 10通用应用程序圆形按钮，单击时带有“动画”

1 个答案: