WPF之资源规划

这篇具有很好参考价值的文章主要介绍了WPF之资源规划。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

总目录



前言

本文主要介绍WPF资源的规划,通过规划如何使得我们的样式可以有高效的复用,以及在应对需求的改动(如换主题,或整体字体,颜色切换)的时候我们可以做到代码改动最小化。


一、总的原则

资源规划总的原则就是:

  • 代码,资源最大化的复用
  • 代码可以做到以最小化的改动应对最大化的需求改动

二、具体技巧

1、提取共同的属性到样式中

当我们实现如下效果时:
wpf 资源packa,WPF,wpf,microsoft
原始代码如下:

        <StackPanel Margin="20" Orientation="Horizontal" VerticalAlignment="Top">
            <Button Height="30" Width="30" Content="1" Margin="10" FontSize="16" FontWeight="Bold"></Button>
            <Button Height="30" Width="30" Content="2" Margin="10" FontSize="16" FontWeight="Bold"></Button>
            <Button Height="30" Width="30" Content="3" Margin="10" FontSize="16" FontWeight="Bold"></Button>
            <Button Height="30" Width="30" Content="4" Margin="10" FontSize="16" FontWeight="Bold"></Button>
            <Button Height="30" Width="30" Content="5" Margin="10" FontSize="16" FontWeight="Bold"></Button>
            <Button Height="30" Width="30" Content="6" Margin="10" FontSize="16" FontWeight="Bold"></Button>
        </StackPanel>

提取到样式中

        <StackPanel Margin="20" Orientation="Horizontal" VerticalAlignment="Top">
            <StackPanel.Resources>
                <Style TargetType="Button">
                    <Setter Property="Margin" Value="10"></Setter>
                    <Setter Property="Height" Value="30"></Setter>
                    <Setter Property="Width" Value="30"></Setter>
                    <Setter Property="FontSize" Value="16"></Setter>
                    <Setter Property="FontWeight" Value="Bold"></Setter>
                </Style>
            </StackPanel.Resources>
            <Button Content="1"></Button>
            <Button Content="2"></Button>
            <Button Content="3"></Button>
            <Button Content="4"></Button>
            <Button Content="5"></Button>
            <Button Content="6"></Button>
        </StackPanel>

上面案例中,只是将样式提取到StackPanel的Resources中,只是为了直观展示,正常都会提取到资源字典中,届时代码将会有极大的优化。

  • 一来,我们将样式与界面上的控件进行了隔离,方便统一改动调整
  • 二来,简化界面,让我们的界面代码框架更清晰

2、制定项目的基本样式

制定项目的基本样式实际操作就是在项目中创建一个BaseStyle资源文件,然后合并到App.xaml中,合并操作如下:

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MvvmDemo;component/Res/Style/BaseStyle.xaml"></ResourceDictionary>
                <ResourceDictionary Source="pack://application:,,,/MvvmDemo;component/Res/Style/MainStyle.xaml"></ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>

项目的基本样式如下文所罗列

1.窗体样式

我们平常做项目的时候,通常会需要做无边框透明的窗体,
如下代码所示:

<Window x:Class="WpfApp4.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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"
        xmlns:local="clr-namespace:WpfApp4"
        mc:Ignorable="d" 
        WindowStyle="None" AllowsTransparency="True" Background="Transparent"  WindowState="Normal"        
        Title="MainWindow" Height="450" Width="800">
    <Grid Background="LightBlue">
        
    </Grid>
</Window>

这个时候如果窗体很多,每个窗体都要设置不免有些麻烦,此时我们可以如下:

  • 先在基本样式的资源文件中,定义窗体样式
        <Style x:Key="CommonWindowStyle" TargetType="Window">
            <Setter Property="WindowStyle" Value="None"></Setter>
            <Setter Property="Background" Value="Transparent"></Setter>
            <Setter Property="WindowState" Value="Normal"></Setter>
            <Setter Property="AllowsTransparency" Value="True"></Setter>
        </Style>
  • 引用,后续只需在需要的窗体引用该样式即可
<Window x:Class="WpfApp4.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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"
        xmlns:local="clr-namespace:WpfApp4"
        mc:Ignorable="d"  Style="{StaticResource CommonWindowStyle}"
        Title="MainWindow" Height="450" Width="800">
    <Grid Background="LightBlue">
        
    </Grid>
</Window>

2.基本字体,色调

通过定义基本的字体和色调,我们可以做到快捷的统一调整界面样式,并且做出来的界面更规整

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:sys="clr-namespace:System;assembly=mscorlib">
    
    <!--FontFamily-->  
    <!--iconfont图标字体-->
    <FontFamily x:Key="IconFontFamily">pack://application:,,,/MvvmDemo;component/Res/Fonts/#iconfont</FontFamily>
    <!--项目中的主要使用字体-->
    <FontFamily x:Key="NormalFontFamily">Microsoft YaHei</FontFamily>
    <!--其他的字体也可定义在这里,如一些荧光字体-->
    
    <!--********************************************************************************************************-->
    
    <!--FontSize-->
    <!--主要字体大小-->
    <sys:Double x:Key="NormalFontSize">14</sys:Double>
    <!--标题字体大小-->
    <sys:Double x:Key="TitleFontSize">28</sys:Double>
    <!--小号字体大小-->
    <sys:Double x:Key="SmallFontSize">8</sys:Double>
    <!--其他规格字体大小也可在此定义-->

    <!--********************************************************************************************************-->

    <!--主要色调 SolidColorBrush-->
    <!--定义主要的颜色-->
    <SolidColorBrush x:Key="MainColor" Color="AliceBlue"></SolidColorBrush>
    <!--定义次要的颜色-->
    <SolidColorBrush x:Key="SecondaryColor" Color="Red"></SolidColorBrush>
    <!--定义次次要的颜色-->
    <SolidColorBrush x:Key="ThirdColor" Color="Green"></SolidColorBrush>

</ResourceDictionary>

4.基本控件效果命名&样式命名

对于样式的命名可以参考系统模板上的命名,如:

   	<SolidColorBrush x:Key="TextBox.Static.Border" Color="#FFABAdB3"/>
   	<SolidColorBrush x:Key="TextBox.MouseOver.Border" Color="#803F9EB2"/>
   	<SolidColorBrush x:Key="TextBox.Focus.Border" Color="#FF3F9EB2"/>
    <SolidColorBrush x:Key="Button.Static.Background" Color="#FF3F9EB2"/>
    <SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
    <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FF3D84A2"/>
    <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
    <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FF3C7296"/>
    <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
    <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
    <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
    <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>

通过【控件.事件.属性】 这样的方式命名,会更直观的知道该属性样式的作用

另外我们对一些TextBox 和 Button 的基本MouseOver 和 Pressed的事件效果定义基本的样式,这个具体项目具体分析,如果项目中的输入框和按钮的样式基本相同,就可以统一定义,如果样式较为分散,则不适合

未完待续


结语

以上就是本文的内容,希望以上内容可以帮助到您,如文中有不对之处,还请批评指正。文章来源地址https://www.toymoban.com/news/detail-834795.html

到了这里,关于WPF之资源规划的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Microsoft Azure和WPF实现人脸检测

    在本文中,详解如何使用Microsoft Azure和WPF技术的帮助下使用实现人脸API应用程序。该应用程序检测人脸图像,显示每张脸周围的红框,以及通过将光标移动到框来显示每张脸的描述的状态栏。 先决条件 在 Azure 门户中创建人脸 API。 在 WPF 应用程序中访问和管理人脸 API 密钥。

    2024年02月09日
    浏览(41)
  • WPF之Microsoft.Toolkit.Mvvm(一)

    WPF编程中使用MVVM框架开发步骤。 第一步: 安装package从nuget: Microsoft.Toolkit.MVVM 和Microsoft.Xaml.Behaviors.Wpf和PropertyChanged.Fody 入下图所示: 第二步:引用命名空间、新建View文件夹、ViewModel文件夹 在Model和ViewModel中引入命名空间如下图所示:                         

    2024年02月04日
    浏览(54)
  • (六)WPF - 资源和样式行为(1)

    1、资源集合 每个元素都有一个 Resources 属性,该属性存储了一个资源字典集合(它是 Resource Dictionary 类的实例)。资源集合可以包含任意类型的对象,并根据字符串编写索引。 为了使用 XML 标记中的资源,需要一种引用资源的方法。这是通过标记扩展完成的。 有两个标记扩

    2024年02月10日
    浏览(42)
  • WPF使用Microsoft.Toolkit.Mvvm框架记录

    前言 为了解决WPF UI与程序逻辑之间得到解耦,所以使用Microsoft.Toolkit.Mvvm框架来实现,说真的开发逻辑真的有些不适应,不过理解就好。框架大体支持ICommand、IMessenger等。 MVVM是Model-View-ViewModel的简写。它本质上就是MVC (Model-View- Controller)的改进版。即模型-视图-视图模型。分

    2024年02月13日
    浏览(49)
  • [WPF]浅析资源引用(pack URI)

    WPF中我们引用资源时常常提到一个概念: pack URI ,这是WPF标识和引用资源最常见的方式,但不是唯一的方式。本文将介绍WPF中引用资源的几种方式,并回顾一下 pack URI 标识引用在不同位置的资源文件的写法。 WPF中使用URI标识和加载位于各种位置的文件,包括当前程序集资源

    2024年02月05日
    浏览(40)
  • wpf数据绑定之元素、资源、后台绑定

            wpf前端的数据绑定主要分为元素、资源以及后台数据三种,元素可以简单的理解为前端的空间数据绑定,资源是在resource里找数据,而后台就是跟cs文件之间的数据互相传递。           先说下元素吧,也就是控件元素,因为代码比较简单,就不上效果了,自己可以

    2024年02月04日
    浏览(58)
  • WPF 入门笔记 - 04 - 数据绑定 - 补充内容:资源基础

    宇宙很大,生活更大,也许以后还有缘相见。 --三体 🌌 💭 该篇作为[WPF 入门笔记 - 04 - 数据绑定] - Additional Content 章节的补充内容 XAML 资源概述 (WPF .NET) WPF中的每一个元素都有一个 Resources 属性,该属性存储了一个资源字典集合。一般来说,可以把WPF的资源按照不同的性质分

    2024年02月11日
    浏览(41)
  • .NetCore WPF 指定一个相对路径的图片,报错“找不到资源”

    开发wpf也有一段时间了,今天试试用.net core开发wpf,看下能否方便的将.net wpf移植到.net core。结果发现n多问题... 像dll引用,.net core已经没有从程序集里引用这一项了。还有部分代码不是.net standard里的,还得添加.net framework框架,需要在工程文件里手动修改。一通百度总算是解

    2024年02月06日
    浏览(37)
  • WPF实现更加灵活绑定复杂Command(使用Microsoft XAML Behaviors 库)

    1、安装NuGet          2、在XAML的命名空间引入: 3、使用(这里是设置了一个Canvas的点击事件,其它面板也是类似这样设置):         --我这里的ViewModel部分是这样子的 4、这样就可以在ViewModel中直接给这个Command内容了,不用像之前那么麻烦地绑定Command了,这样更加清晰,

    2024年02月04日
    浏览(49)
  • WPF .Net6框架下, 使用 Microsoft.Xaml.Behaviors.Wpf 的Interaction.Triggers特性,实现ComboBox 在展开时,触发刷新列表内容的动作

    ComboBox 在WPF中是常见的控件。 一般情况下,在绑定好数据源后,其内容是固定的。 当然,你也可以实时刷新,但这将带来较高的资源消耗。 因此有个折中的办法: 只在它在展开时,自动更新列表内容。 当前文章基于 .Net6框架,其他框架不适用。 这个是用于平替winform某个组

    2024年02月09日
    浏览(59)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包