一个Wpf控件库(Wpf客户端框架使用)
本控件库,结合了MahApps.Metro,Material-Design,HandyControl,PanuonUI,Xceed等控件库,做了一个集成,并有部分自定义的控件,供大家参考使用,以下为控件库截图,本控件库会保持定期维护定期更新,欢迎大家光临。(如果我使用了您的控件,没有在本文提出,请联系我,我给您加上)
控件库地址:AI-wpf-controls: https://gitee.com/akwkevin/aistudio.-wpf.-aclient的控件库
快速使用方法
1.新建WPF应用程序:TestAIControls
2.使用nuget安装AIStudio.Wpf.Controls控件库
3.App.xaml 引用资源
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!--颜色资源-->
<ResourceDictionary Source="pack://application:,,,/AIStudio.Wpf.Controls;component/Themes/Colors.xaml"/>
<ResourceDictionary Source="pack://application:,,,/AIStudio.Wpf.Controls;component/Themes/MahApps.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
4.MainWindow.xaml界面使用控件
<Window x:Class="TestAIControls.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:TestAIControls"
xmlns:ac="https://gitee.com/akwkevin/AI-wpf-controls"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<WrapPanel>
<ac:Avatar Size="Small" Shape="Square" Margin="2">AI</ac:Avatar>
<ac:Badged Margin="2" Badge="1" IsWaving="True">
<Rectangle Width="24" Height="24" Fill="{DynamicResource MahApps.Brushes.Gray8}"></Rectangle>
</ac:Badged>
<Button Content="Default" Margin="2" Style="{DynamicResource AIStudio.Styles.Button}"/>
<Button Content="Outlined" Margin="2" Style="{DynamicResource AIStudio.Styles.Button.Outlined}"/>
<Button Content="Flat" Margin="2" Style="{DynamicResource AIStudio.Styles.Button.Flat}"/>
<Button Content="Paper" Margin="2" Style="{DynamicResource AIStudio.Styles.Button.Paper}"/>
<Button Content="Progress" Margin="2" ac:ButtonAttach.Value="50" Style="{DynamicResource AIStudio.Styles.Button.Progress}"/>
<CheckBox Margin="2" Content="CheckBox" IsChecked="True" Style="{DynamicResource AIStudio.Styles.CheckBox}"/>
<CheckBox Margin="2" Content="CheckBoxNull" IsChecked="{x:Null}" Style="{DynamicResource AIStudio.Styles.CheckBox}"/>
<CheckBox Margin="2" Content="RightCheckBox" IsChecked="True" ac:IconAttach.Dock="Right" Style="{DynamicResource AIStudio.Styles.CheckBox}"/>
<CheckBox Margin="2" Content="Plain" IsChecked="True" Style="{DynamicResource AIStudio.Styles.CheckBox.Plain}"/>
<ac:ColorPicker Width="180" Margin="2"/>
<ComboBox Width="180" Margin="2" ac:ControlAttach.Watermark="请选择" Style="{DynamicResource AIStudio.Styles.ComboBox}">
<ComboBoxItem Content="子项1"/>
<ComboBoxItem Content="子项2"/>
</ComboBox>
<DatePicker Margin="2" Style="{DynamicResource AIStudio.Styles.DatePicker}" MinWidth="120" ac:ControlAttach.Watermark="请选择日期"/>
<ac:DropDown Margin="2" Content="Down">
<ac:DropDown.Child>
<TextBlock Margin="10" Text="下拉列表" VerticalAlignment="Center"/>
</ac:DropDown.Child>
</ac:DropDown>
<ac:LinkTextBlock Margin="2" Content="Link" ViewInBrower="True" Url="https://gitee.com/akwkevin" />
<ac:Loading Margin="2" IsRunning="True"></ac:Loading>
<ProgressBar Margin="10" Width="100" Value="50" Style="{DynamicResource AIStudio.Styles.ProgressBar}"/>
<ProgressBar Margin="10" Width="100" Value="70" IsIndeterminate="True" Style="{DynamicResource AIStudio.Styles.ProgressBar}"/>
<ProgressBar Margin="10" Width="100" Height="22" Value="90" ac:ControlAttach.CornerRadius="10" Style="{DynamicResource AIStudio.Styles.ProgressBar.Percent}"/>
<ProgressBar Margin="10" Width="100" Value="50" Style="{DynamicResource AIStudio.Styles.ProgressBar}"/>
<ProgressBar Margin="10" Width="100" Value="70" IsIndeterminate="True" Style="{DynamicResource AIStudio.Styles.ProgressBar}"/>
<ProgressBar Margin="10" Width="100" Height="22" Value="90" ac:ControlAttach.CornerRadius="10" Style="{DynamicResource AIStudio.Styles.ProgressBar.Percent}"/>
<TextBox MinWidth="120" Margin="2" ac:ControlAttach.Watermark="请输入内容" Style="{DynamicResource AIStudio.Styles.TextBox}" ></TextBox>
<TextBox MinWidth="120" Margin="2" ac:ControlAttach.Watermark="请输入内容" ac:ShadowAttach.DropShadowEffect="{x:Null}" Style="{DynamicResource AIStudio.Styles.TextBox}" ></TextBox>
<PasswordBox Margin="2" MinWidth="120" ac:ControlAttach.Watermark="请输入密码" Style="{DynamicResource AIStudio.Styles.PasswordBox}"/>
<PasswordBox Margin="2" MinWidth="120" ac:ControlAttach.Watermark="请输入密码" Style="{DynamicResource AIStudio.Styles.PasswordBox.Plus}"/>
<TextBox MinWidth="120" Margin="2" ac:ControlAttach.Watermark="请输入内容" Style="{DynamicResource AIStudio.Styles.TextBox}" ></TextBox>
<TextBox MinWidth="120" Margin="2" ac:ControlAttach.Watermark="请输入内容" ac:ShadowAttach.DropShadowEffect="{x:Null}" Style="{DynamicResource AIStudio.Styles.TextBox}" ></TextBox>
<PasswordBox Margin="2" MinWidth="120" ac:ControlAttach.Watermark="请输入密码" Style="{DynamicResource AIStudio.Styles.PasswordBox}"/>
<PasswordBox Margin="2" MinWidth="120" ac:ControlAttach.Watermark="请输入密码" Style="{DynamicResource AIStudio.Styles.PasswordBox.Plus}"/>
</WrapPanel>
</Window>
5:如果使用MaterialDesign风格:App.xaml的引用资源替换成如下:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!--颜色资源-->
<ResourceDictionary Source="pack://application:,,,/AIStudio.Wpf.Controls;component/Themes/MaterialDesignColor.xaml"/>
<ResourceDictionary Source="pack://application:,,,/AIStudio.Wpf.Controls;component/Themes/MaterialDesign.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
6:如果与MahApps.Metro一起使用(需要安装MahApps.Metro),App.xaml的引用资源替换成如下:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!-- MahApps -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />
<ResourceDictionary Source="pack://application:,,,/AIStudio.Wpf.GridControls;component/Themes/MahApps.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
7:如果与MaterialDesign一起使用(需要安装MaterialDesign),App.xaml的引用资源替换成如下:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<materialDesign:MahAppsBundledTheme BaseTheme="Inherit" PrimaryColor="DeepPurple" SecondaryColor="LightBlue"/>
<!--Material Design-->
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
<ResourceDictionary Source="pack://application:,,,/AIStudio.Wpf.Controls;component/Themes/MaterialDesign.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
以下为控件使用截图:
Button
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331627-416494486.png)
Icon
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331278-1257757838.png)
Path
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331243-1034170830.png)
TextBox
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331593-1287478608.png)
DropDown
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331151-2146288034.png)
Menu
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331272-770628769.png)
Link
Pagination
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331317-262236002.png)
StepBar
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331242-1596084173.png)
CheckBox
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331582-380805011.png)
DateTimePicker
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331242-4711615.png)
Form
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331317-708209188.png)
ComboBox
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331814-1338709755.png)
Radio
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331276-692961645.png)
Rate
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331254-2141939051.png)
Repeat
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331824-1789743718.png)
Slider
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331256-1638500774.png)
Toggle
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331313-624626236.png)
UpDown
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331584-1170181606.png)
Upload
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331297-1905467468.png)
Avatar
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331417-1325237812.png)
Badge
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331778-1730254476.png)
Calender
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331351-282388725.png)
Card
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331348-64662072.png)
Carousel
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331798-2093936574.png)
DataGrid
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331244-1286289514.png)
Expander
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331275-2016358340.png)
Group
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331590-1086706140.png)
Image
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331178-55714155.png)
Tag
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331337-1673743538.png)
Tabs
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331855-1453304037.png)
ToolBar
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331309-869795778.png)
TextBlock
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331188-1742153460.png)
Timeline
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331787-2100612797.png)
Tree
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331314-1808220714.png)
List
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331302-968789870.png)
Notice
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331835-1557076185.png)
MessageBox
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331356-1070861367.png)
Diaglog
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331202-1849318880.png)
Progress
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331814-2012604280.png)
Loading
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331413-2146339687.png)
Anchor
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331286-2071499336.png)
GotoTop
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331777-1041729583.png)
Divider
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331161-1719219163.png)
ColorPicker
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331280-1305062372.png)
MediaPlayer
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331802-253562690.png)
Verify
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331378-345554822.png)
WebBrower
![](https://img2022.cnblogs.com/blog/809298/202205/809298-20220522121331206-1102889909.png)