ketan Ram Patil Ответов: 1

Как создать круглую угловую кнопку и эффект наведения курсора мыши в uwp


Здравствуйте друзья

я хочу создать круглую угловую кнопку и по щелчку мыши изменить ее цвет переднего плана и фона в uwp xaml.

у меня есть стиль кода, который создает круглую кнопку, но как изменить цвет переднего плана и фона кнопки в uwp

благодарим вас заранее. :) хорошего вам дня... :)

Что я уже пробовал:

<Style x:Key="RoundBtn" TargetType="Button">
            <Setter Property="Background" Value="#27aae1"/>
            <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
            <Setter Property="BorderBrush" Value="{ThemeResource SystemControlForegroundTransparentBrush}"/>
            <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}"/>
            <Setter Property="Padding" Value="8,4,8,4"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
            <Setter Property="FontWeight" Value="Normal"/>
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
            <Setter Property="UseSystemFocusVisuals" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid x:Name="RootGrid" >
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                            <PointerUpThemeAnimation Storyboard.TargetName="RootGrid"/>
                                        </Storyboard>
                                    </VisualState>

                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Rectangle RadiusX="20" RadiusY="20" Fill="{TemplateBinding Background}" Margin="0,0,10,0" />
                            <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            <Button Content="Button" HorizontalContentAlignment="Left" VerticalAlignment="Top"  HorizontalAlignment="Left" Margin="-333,-562,0,0"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>



<Button FontSize="14" FontFamily="{StaticResource inventoryFont}" Grid.Row="4" Grid.Column="4" Style="{StaticResource RoundBtn}" Background="#27AAE1"  MinWidth="220" Height="40" Foreground="#ffffff" Click="AuthenticateUser" Name="LoginBtn" HorizontalAlignment="Left" VerticalAlignment="Center" Width="171" Padding="0,0,0,0" BorderThickness="0,0,0,0" UseSystemFocusVisuals="True" UseLayoutRounding="True" FocusVisualPrimaryBrush="#00000000" FocusVisualSecondaryBrush="#00000000" Margin="0,0,0,0">Login</Button>


выше стиль может создать кнопку с круглым углом, но как дать мыши над щелчком мыши эффект ??

1 Ответов

Рейтинг:
0

Gerry Schmitz

Что касается меня, то я бы просто использовал "code-behind" в событии click, чтобы установить цвета кнопки "sender as".

(Я не могу утруждать себя этим с помощью XAML, потому что UWP не имеет тех же триггеров, что и WPF, которые я мог бы рассмотреть).

Время слишком драгоценно, чтобы быть рабом MVVM или чего-то еще, что мотивирует человека искать "чистое" решение XAML (IMO).


ketan Ram Patil

спасибо за ваш ценный ответ. пожалуйста, поделитесь своим кодом код