首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >AvaloniaUI样式-伪类

AvaloniaUI样式-伪类
EN

Stack Overflow用户
提问于 2021-03-02 15:43:01
回答 2查看 2.2K关注 0票数 6

我正在尝试avalonia的样式和大多数作品,除了伪类之外,它们只是被忽略了。

我已经创建了一个窗口,所有的样式都在其中,我使用样式创建了一个用户控件(带有一个按钮--伪类在按钮上)。我不使用代码,只使用xaml来定义样式。

我已经在按钮的"Style Selector“中试用了它,如" button :pseudoclassname”和"Button.le:pseudoclassname“。我也尝试过"Button:pointerover“和”Button:悬浮“,因为文档中提到了可以修改的内容。没有结果。伪类的样式都被忽略,其他类的执行都是正确的。

是我做错什么了还是这是avalonia的窃听器?

xaml窗口文件:

代码语言:javascript
运行
复制
<Window xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:views="clr-namespace:Hub.Views"
        xmlns:vm="using:Hub.ViewModels"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
        x:Class="Hub.Views.MainWindow"
        Icon="/Assets/avalonia-logo.ico"
        Width="200" Height="300"
        Title="Hub"
        Classes="le">

    <Window.Styles>
        <Style Selector="Window.le">
            <Setter Property="Background" Value="#191919"/>
        </Style>
        <Style Selector="Button.le">
            <Setter Property="Background" Value="green"/>
            <Setter Property="Foreground" Value="white"/>
        </Style>
        <Style Selector="Button.le:pointerover">
            <Setter Property="Background" Value="red"/>
            <Setter Property="Foreground" Value="white"/>
        </Style>
        <Style Selector="Button.le:pressed">
            <Setter Property="Background" Value="blue"/>
            <Setter Property="Foreground" Value="white"/>
        </Style>
        <Style Selector="TextBlock.le_update">
            <Setter Property="FontStyle" Value="Italic"/>
            <Setter Property="FontSize" Value="17"/>
            <Setter Property="FontFamily" Value="Arial, Verdana"/>
            <Setter Property="Foreground" Value="white"/>
            <Setter Property="Background" Value="transparent"/>
        </Style>
    </Window.Styles>
    
    <views:UpdateView/>

</Window>

xaml用户控制文件:

代码语言:javascript
运行
复制
<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
             x:Class="Hub.Views.UpdateView">
    <DockPanel>
        <StackPanel DockPanel.Dock="Bottom">
            <Button Classes="le" HorizontalAlignment="Center" HorizontalContentAlignment="Center" Width="300">
                Check for updates
            </Button>
        </StackPanel>
        <StackPanel Spacing="5" Margin="5">
            <TextBlock Classes="le_update" HorizontalAlignment="Center" Margin="4">
                No updates for Hub.
            </TextBlock>
            <TextBlock Classes="le_update" HorizontalAlignment="Center" Margin="4">
                No updates for Engine.
            </TextBlock>
        </StackPanel>
    </DockPanel>
</UserControl>

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2021-03-02 17:11:00

ButtonBackground属性确实会受到样式的影响,但此时它对实际的Button_‘s背景没有影响,因为Background属性只控制按钮的正常状态。

如果您查看默认的Button样式这里,可以看到它通过TemplateBinding将其背景传递给ContentPresenter

代码语言:javascript
运行
复制
    <Setter Property="Template">
      <ControlTemplate>
        <ContentPresenter x:Name="PART_ContentPresenter"
                          Background="{TemplateBinding Background}"

但是以这样的风格覆盖了ContentPresenter的背景:

代码语言:javascript
运行
复制
  <Style Selector="Button:pointerover /template/ ContentPresenter#PART_ContentPresenter">
    <Setter Property="Background" Value="{DynamicResource ButtonBackgroundPointerOver}" />

因为实际绘制背景的是ContentPresenter (Button是一个没有外观的控件),所以您将看到按钮具有ButtonBackgroundPointerOver,而不是ButtonBackground属性值。

因此,您需要编写一个样式来更改内部ContentPresenter,如下所示:

代码语言:javascript
运行
复制
<Style Selector="Button.le:pointerover /template/ ContentPresenter#PART_ContentPresenter">
  <Setter Property="Background" Value="green" />
</Style>

不幸的是,这使得您的样式依赖主题,因为控件模板在默认主题和fluent主题之间是不同的。

票数 6
EN

Stack Overflow用户

发布于 2021-03-06 09:35:21

对我提出的问题,Kekekeks给出的答案是正确的。

但是,我在希望中使用这个空间来帮助所有上没有xaml背景的avalonia新手用户,就像我所做的那样。我们中的大多数人都会看到avalonia为我们的应用程序提供一个在/Mac/Linux上工作的界面。老实说,在撰写本文的时候,c#中没有真正的替代方案。

目前,Avalonia确实有一些好的示例和文档,但对于那些没有xaml背景的人来说并非如此。

因此,去Udemy,LikedIn.Learning,Youtube,或者任何你在WPF上找到好课程的地方,然后去Avalonia的文档,开始到处玩。

(Avalonia和WPF)的相似之处是巨大的!和是的,这在文档中被提到过几次,但是一句直截了当的话:“如果你是xaml的新手,就先去学习WPF吧!”在文档的首页上,可以为我节省相当一部分的时间,让我能够通过网站找到所有的东西。

公平是公平的,该项目仍然处于测试版,而且该网站已经为这一阶段提供了详细的文档,所以不要责怪团队!

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/66442508

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档