WPF界面美化（整体作用到控件），一步步教你使用FirstFloor.ModernUI

开发工具：VS2015

1、获取相关DLL(通过NuGet或者GitHub上下载的源码中获得)，并在项目中添加引用

FirstFloor.ModernUI.dll

Microsoft.Windows.Shell.dll

UIShell.OSGi(这个是我运行程序时报的错误"未能加载文件或程序集"，然后在NuGet上下载得到的)

2、在.xaml文件中将MainWindow转为Mui.ModernUIWindow

.xaml.cs文件中继承Window改为继承ModernWindow

<mui:ModernWindow x:Class="GFunctionCalculate.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:GFunctionCalculate"
        xmlns:mui="http://firstfloorsoftware.com/ModernUI"
        mc:Ignorable="d"
        Title="MainWindow" Height="600" Width="800" WindowState="Normal" WindowStartupLocation="CenterScreen" ContentSource="/page1.xaml">
   
    <mui:ModernWindow.MenuLinkGroups>
        <mui:LinkGroup DisplayName="" >
            <mui:LinkGroup.Links>
                <mui:Link DisplayName="选择文件" Source="/page1.xaml"/>
                <mui:Link DisplayName="数据列表" Source="/page2.xaml"/>
            </mui:LinkGroup.Links>
        </mui:LinkGroup>
    </mui:ModernWindow.MenuLinkGroups>
</mui:ModernWindow>

 

using FirstFloor.ModernUI.Windows.Controls;
using FirstFloor.ModernUI.Presentation;

namespace GFunctionCalculate
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : ModernWindow
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

3、在App.xaml文件中添加样式（不添加运行会是全黑的窗口）

<Application x:Class="GFunctionCalculate.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:GFunctionCalculate"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.xaml" />
                <ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.Light.xaml"/>
            </ResourceDictionary.MergedDictionaries>
            <Color x:Key="AccentColor">#008A00</Color>
            <!--添加背景图片时使用-->
        <!--<Rectangle x:Key="WindowBackgroundContent" x:Shared="false">
            <Rectangle.Fill>
                    <ImageBrush Opacity=".1" ImageSource="/Assets/background.Love.jpg" Stretch="UniformToFill" />
            </Rectangle.Fill>
        </Rectangle>-->
        </ResourceDictionary>
    </Application.Resources>
</Application>

4、添加Page页

MainWindow中：

<mui:ModernWindow x:Class="GFunctionCalculate.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:GFunctionCalculate"
        xmlns:mui="http://firstfloorsoftware.com/ModernUI"
        mc:Ignorable="d"
        Title="MainWindow" Height="600" Width="800" WindowState="Normal" WindowStartupLocation="CenterScreen" ContentSource="/page1.xaml">
   
    <mui:ModernWindow.MenuLinkGroups>
        <mui:LinkGroup DisplayName="" >
            <mui:LinkGroup.Links>
                <mui:Link DisplayName="数据列表" Source="/page1.xaml"/>
            </mui:LinkGroup.Links>
        </mui:LinkGroup>
    </mui:ModernWindow.MenuLinkGroups>
</mui:ModernWindow>

新建UserControl，命名为page1

page1.xaml

<UserControl x:Class="GFunctionCalculate.page1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:GFunctionCalculate"
             xmlns:mui="http://firstfloorsoftware.com/ModernUI"
             xmlns:core="clr-namespace:System;assembly=mscorlib"
             mc:Ignorable="d" 
             d:DesignHeight="600" d:DesignWidth="800">
    <Grid>
        <Grid.Resources>
            <!--Create list of enumeration values-->
            <ObjectDataProvider x:Key="myEnum" MethodName="GetValues" ObjectType="{x:Type core:Enum}">
                <ObjectDataProvider.MethodParameters>
                    <x:Type Type="local:OrderStatus"/>
                </ObjectDataProvider.MethodParameters>
            </ObjectDataProvider>
        </Grid.Resources>
        
        <DockPanel>
            <TextBlock DockPanel.Dock="Top" Text="DATAGRID" Style="{StaticResource Heading2}" Margin="0,0,0,8" />
            <DataGrid Name="DG1" ItemsSource="{Binding}" AutoGenerateColumns="False" >
                <DataGrid.Columns>
                    <mui:DataGridTextColumn Header="First Name"  Binding="{Binding FirstName}"/>
                    <mui:DataGridTextColumn Header="Last Name" Binding="{Binding LastName}" />
                    <mui:DataGridTextColumn Header="Email" Binding="{Binding Email}"/>
                    <mui:DataGridCheckBoxColumn Header="Member" Binding="{Binding IsMember}" />
                    <mui:DataGridComboBoxColumn Header="Order Status" SelectedItemBinding="{Binding Status}" ItemsSource="{Binding Source={StaticResource myEnum}}" />
                </DataGrid.Columns>
            </DataGrid>
        </DockPanel>
    </Grid>
</UserControl>

page1.xaml.cs

using System.Collections.ObjectModel;
using System.Windows.Controls;

namespace GFunctionCalculate
{
    public enum OrderStatus { None, New, Processing, Shipped, Received };
    public class Customer
    {
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Email { get; set; }
        public bool IsMember { get; set; }
        public OrderStatus Status { get; set; }
    }


    /// <summary>
    /// Interaction logic for ControlsStylesDataGrid.xaml
    /// </summary>
    public partial class page1 : UserControl
    {
        public page1()
        {
            InitializeComponent();

            ObservableCollection<Customer> custdata = GetData();

            //Bind the DataGrid to the customer data
            DG1.DataContext = custdata;
        }

        private ObservableCollection<Customer> GetData()
        {
            var customers = new ObservableCollection<Customer>();
            customers.Add(new Customer { FirstName = "Orlando", LastName = "Gee", Email = "orlando0@adventure-works.com", IsMember = true, Status = OrderStatus.New });
            customers.Add(new Customer { FirstName = "Keith", LastName = "Harris", Email = "keith0@adventure-works.com", IsMember = true, Status = OrderStatus.Received });
            customers.Add(new Customer { FirstName = "Donna", LastName = "Carreras", Email = "donna0@adventure-works.com", IsMember = false, Status = OrderStatus.None });
            customers.Add(new Customer { FirstName = "Janet", LastName = "Gates", Email = "janet0@adventure-works.com", IsMember = true, Status = OrderStatus.Shipped });
            customers.Add(new Customer { FirstName = "Lucy", LastName = "Harrington", Email = "lucy0@adventure-works.com", IsMember = false, Status = OrderStatus.New });
            customers.Add(new Customer { FirstName = "Rosmarie", LastName = "Carroll", Email = "rosmarie0@adventure-works.com", IsMember = true, Status = OrderStatus.Processing });
            customers.Add(new Customer { FirstName = "Dominic", LastName = "Gash", Email = "dominic0@adventure-works.com", IsMember = true, Status = OrderStatus.Received });
            customers.Add(new Customer { FirstName = "Kathleen", LastName = "Garza", Email = "kathleen0@adventure-works.com", IsMember = false, Status = OrderStatus.None });
            customers.Add(new Customer { FirstName = "Katherine", LastName = "Harding", Email = "katherine0@adventure-works.com", IsMember = true, Status = OrderStatus.Shipped });
            customers.Add(new Customer { FirstName = "Johnny", LastName = "Caprio", Email = "johnny0@adventure-works.com", IsMember = false, Status = OrderStatus.Processing });

            return customers;
        }
    }
}

 运行结果：

谢谢观看，有所帮助的话请点个赞"*★,°*:.☆(￣▽￣)/$:*.°★* 。"