WPF自定义控件の用户控件（完结）
Posted lonelyxmas
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了WPF自定义控件の用户控件（完结）相关的知识，希望对你有一定的参考价值。
原文:WPF自定义控件（五）の用户控件（完结）用户控件，WPF中是继承自UserControl的控件，我们可以在里面融合我们的业务逻辑。
示例：（一个厌恶选择的用户控件）
后端：
using iMicClassBase;
using iMicClassBase.BaseControl;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Forms;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace iMicClassUI.HomeToolControls
{
/**
* @控件名：HomeToolBackgroundPanel
* @功能 ：切换黑板界面背景
* @作者 ：tjer
* @时间 ：2017.05.19
* **/
/// <summary>
/// HomeToolBackgroundPanel.xaml 的交互逻辑
/// </summary>
public partial class HomeToolBackgroundPanel : System.Windows.Controls.UserControl
{
#region 委托及事件
/// <summary>
/// 背景改变事件委托
/// </summary>
/// <param name="sender">源</param>
/// <param name="type">类型</param>
/// <param name="ChangeObj">改变对象</param>
public delegate void BackGroundSelectedChangeDelegate(object sender, BBBackGroundType type,object ChangeObj);
/// <summary>
/// 背景改变事件
/// </summary>
public BackGroundSelectedChangeDelegate BackGroundSelectedChange = null;
/// <summary>
/// 选项卡改变事件
/// </summary>
public static readonly RoutedEvent TabItemChangeEvent = EventManager.RegisterRoutedEvent
("TabItemChange", RoutingStrategy.Bubble, typeof(RoutedEventArgs), typeof(HomeToolBackgroundPanel));
public event RoutedEventHandler TabItemChange
{
add { AddHandler(TabItemChangeEvent, value); }
remove { RemoveHandler(TabItemChangeEvent, value); }
}
#endregion
#region 变量
/// <summary>
/// 调用系统颜色框
/// </summary>
private ColorDialog SysColorDia = new ColorDialog();
#endregion
#region 属性及依赖属性
/// <summary>
/// 当前选项卡背景类型
/// </summary>
public BBBackGroundType SelectedOption
{
get;
set;
} = BBBackGroundType.ColorType;
/// <summary>
/// 当前颜色
/// </summary>
public static readonly DependencyProperty CurrentColorProperty =
DependencyProperty.Register("CurrentColor", typeof(System.Windows.Media.Color), typeof(HomeToolBackgroundPanel), new PropertyMetadata((Color)ColorConverter.ConvertFromString("#FF18311B"), OnCurrentColorChanged));
[Description("当前颜色"), Browsable(false)]
public System.Windows.Media.Color CurrentColor
{
get { return (System.Windows.Media.Color)GetValue (CurrentColorProperty); }
set { SetValue(CurrentColorProperty, value); }
}
/// <summary>
/// 当前本地图片背景，从1开始，默认是无效0
/// <summary>
public static readonly DependencyProperty CurrentSysBgIndexProperty =
DependencyProperty.Register("CurrentSysBgIndex", typeof(int), typeof(HomeToolBackgroundPanel), new PropertyMetadata(0, OnCurrentSysBgIndexChanged));
[Description("当前系统图片背景索引"), Browsable(false)]
public int CurrentSysBgIndex
{
get { return (int)GetValue(CurrentSysBgIndexProperty); }
set { SetValue(CurrentSysBgIndexProperty ,value); }
}
/// <summary>
/// 当前本地图片路径
/// </summary>
public static readonly DependencyProperty CurrentLocalImageBgURIProperty =
DependencyProperty.Register("CurrentLocalImageBgURI", typeof(string), typeof(HomeToolBackgroundPanel), new PropertyMetadata(string.Empty, OnCurrentLocalImageBgURIChanged));
[Description("当前本地图片路径"), Browsable(false)]
public string CurrentLocalImageBgURI
{
get { return (string)GetValue(CurrentLocalImageBgURIProperty); }
set { SetValue(CurrentLocalImageBgURIProperty, value); }
}
#endregion
#region 窗体事件
/// <summary>
/// 构造
/// </summary>
public HomeToolBackgroundPanel()
{
InitializeComponent();
}
/// <summary>
/// 初始化，每次显示的时候调用，可以展示当前黑板背景状态
/// </summary>
/// <param name="type">当前黑板背景类型</param>
/// <param name="obj">背景内容对象</param>
public void Init(BBBackGroundType type,object obj)
{
switch (type)
{
case BBBackGroundType.ColorType:
tabPanel.SelectedIndex = 0;
CurrentColor = (System.Windows.Media.Color)obj ;
break;
case BBBackGroundType.ImageType:
tabPanel.SelectedIndex = 1;
CurrentSysBgIndex = (int)obj;
break;
case BBBackGroundType.LocalType:
tabPanel.SelectedIndex = 2;
CurrentLocalImageBgURI = (string)obj;
break;
}
}
#endregion
#region 依赖事件
/// <summary>
/// 颜色改变事件
/// </summary>
/// <param name="d">依赖对象</param>
/// <param name="e">事件</param>
private static void OnCurrentColorChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
if (e.OldValue == e.NewValue)
{
return;
}
if ((Color)e.NewValue== (Color)ColorConverter.ConvertFromString("#FF18311B"))
{
return;
}
HomeToolBackgroundPanel control = (HomeToolBackgroundPanel)d;
control.CurrentSysBgIndex = 0;
control.CurrentLocalImageBgURI = string.Empty;
control.BackGroundSelectedChange?.Invoke(control, BBBackGroundType.ColorType,control.CurrentColor);
}
/// <summary>
/// 背景索引改变事件
/// </summary>
/// <param name="d">依赖对象</param>
/// <param name="e">事件</param>
private static void OnCurrentSysBgIndexChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
if (e.OldValue == e.NewValue)
{
return;
}
if ((int)e.NewValue==0)
{
return;
}
HomeToolBackgroundPanel control = (HomeToolBackgroundPanel)d;
control.CurrentColor = (Color)ColorConverter.ConvertFromString("#FF18311B");
control.CurrentLocalImageBgURI = string.Empty;
control.BackGroundSelectedChange?.Invoke(control, BBBackGroundType.ImageType, control.CurrentSysBgIndex);
}
/// <summary>
/// 本地背景路径改变
/// </summary>
/// <param name="d">依赖对象</param>
/// <param name="e">事件</param>
private static void OnCurrentLocalImageBgURIChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
if (e.OldValue == e.NewValue)
{
return;
}
if ((string)e.NewValue == string.Empty)
{
return;
}
HomeToolBackgroundPanel control = (HomeToolBackgroundPanel)d;
control.CurrentColor = (Color)ColorConverter.ConvertFromString("#FF18311B");
control.CurrentSysBgIndex = 0;
control.BackGroundSelectedChange?.Invoke(control, BBBackGroundType.LocalType, control.CurrentLocalImageBgURI);
}
#endregion
#region 内部操作事件
/// <summary>
/// 选项卡改变事件
/// </summary>
/// <param name="sender">事件源</param>
/// <param name="e">事件</param>
private void TabItem_Select(object sender, RoutedEventArgs e)
{
//选项卡改变，背景类型改变
switch (tabPanel.SelectedIndex)
{
case 0:
SelectedOption = BBBackGroundType.ColorType;
break;
case 1:
SelectedOption = BBBackGroundType.ImageType;
break;
case 2:
SelectedOption = BBBackGroundType.LocalType;
break;
}
RoutedEventArgs routedEventArgs = new RoutedEventArgs(TabItemChangeEvent, e.OriginalSource);
RaiseEvent(routedEventArgs);
}
/// <summary>
/// 面板颜色值选择
/// </summary>
/// <param name="sender">事件源</param>
/// <param name="e">事件</param>
private void ColorPanel_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
colorPanelCurrent.Color = (sender as ColorPanel).Color;
if ((sender as ColorPanel).Color == (Color)(ColorConverter.ConvertFromString("#FF18311B"))) //保证颜色值是设定色的时候也会触发
{
btnBg1.IsSelected = false;
btnBg2.IsSelected = false;
btnBg3.IsSelected = false;
btnBg4.IsSelected = false;
CurrentSysBgIndex = 0;
CurrentLocalImageBgURI = string.Empty;
BackGroundSelectedChange?.Invoke(this, BBBackGroundType.ColorType, CurrentColor);
}
}
/// <summary>
/// 点击更多颜色
/// </summary>
/// <param name="sender">事件源</param>
/// <param name="e">事件</param>
private void btnMoreColor_Click(object sender, RoutedEventArgs e)
{
DialogResult result = SysColorDia.ShowDialog();
if (result == System.Windows.Forms.DialogResult.OK)
{
colorPanelCurrent.Color = ColorConverterHelp.ConvertToMediaColor(SysColorDia.Color);
}
}
/// <summary>
/// 本地背景选择
/// </summary>
/// <param name="sender">事件源</param>
/// <param name="e">事件</param>
private void SelectButton_ButtonSelected(object sender, EventArgs e)
{
int index = Convert.ToInt32((sender as SelectButton).Tag);
switch (index)
{
case 1:
btnBg2.IsSelected = false;
btnBg3.IsSelected = false;
btnBg4.IsSelected = false;
CurrentSysBgIndex = 1;
break;
case 2:
btnBg1.IsSelected = false;
btnBg3.IsSelected = false;
btnBg4.IsSelected = false;
CurrentSysBgIndex = 2;
break;
case 3:
btnBg1.IsSelected = false;
btnBg2.IsSelected = false;
btnBg4.IsSelected = false;
CurrentSysBgIndex = 3;
break;
case 4:
btnBg1.IsSelected = false;
btnBg2.IsSelected = false;
btnBg3.IsSelected = false;
CurrentSysBgIndex = 4;
break;
}
}
/// <summary>
/// 点击选择本地图片
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void btnAddLoaclImage_Click(object sender, RoutedEventArgs e)
{
OpenFileDialog localBg = new OpenFileDialog();
localBg.DefaultExt = ".png";
localBg.Filter = "(背景)|*.png";
if (localBg.ShowDialog() == DialogResult.OK)
{
btnBg1.IsSelected = false;
btnBg2.IsSelected = false;
btnBg3.IsSelected = false;
btnBg4.IsSelected = false;
CurrentSysBgIndex = 0;
CurrentLocalImageBgURI = System.IO.Path.GetFullPath(localBg.FileName);
}
}
#endregion
}
}
前端：
<UserControl
x:Name="homeToolBackgroundPanel"
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:iMicClassUI.HomeToolControls"
xmlns:iMicClassBase="clr-namespace:iMicClassBase;assembly=iMicClassBase"
x:Class="iMicClassUI.HomeToolControls.HomeToolBackgroundPanel"
mc:Ignorable="d"
d:DesignHeight="110"
d:DesignWidth="180">
<Grid>
<Border BorderBrush="White" BorderThickness="0" ClipToBounds="True" SnapsToDevicePixels="True"
CornerRadius="5" Width="180" Height="110">
<TabControl x:Name="tabPanel" Style="{StaticResource TabControlStyle2}" SelectionChanged="TabItem_Select">
<!--颜色选项卡-->
<TabItem x:Name="TabItemOnlyColor" Header="纯色" Cursor="Hand" IsSelected="True" Style="{DynamicResource TabItemStyle3}">
<StackPanel Height="80" Width="180">
<Line x:Name="LINEONE" Stroke="#FF56C253" X1="18" Y1="0.5" X2="48" Y2="0.5" StrokeThickness="2"/>
<WrapPanel Height="80" ItemHeight="40" ItemWidth="40">
<StackPanel Margin="0,5,0,0" ToolTip="当前颜色">
<iMicClassBase:ColorPanel Name="colorPanelCurrent"
Color="{Binding CurrentColor ,ElementName=homeToolBackgroundPanel,Mode=TwoWay}"
Margin="0,5,0,0" Width="15" Height="15"/>
<TextBlock Text="当前" FontSize="12" Foreground="Black"
VerticalAlignment="Top" HorizontalAlignment="Center"/>
</StackPanel>
<iMicClassBase:ColorPanel Color="#FF18311B" Margin="2" MouseLeftButtonDown="ColorPanel_MouseLeftButtonDown"/>
<iMicClassBase:ColorPanel Color="#FF000000" Margin="2" MouseLeftButtonDown="ColorPanel_MouseLeftButtonDown"/>
<iMicClassBase:ColorPanel Color="#FF787878" Margin="2" MouseLeftButtonDown="ColorPanel_MouseLeftButtonDown"/>
<iMicClassBase:ColorPanel Color="#FFD1D1D1" Margin="2" MouseLeftButtonDown="ColorPanel_MouseLeftButtonDown"/>
<iMicClassBase:ColorPanel Color="#FFFFFFFF" Margin="2" MouseLeftButtonDown="ColorPanel_MouseLeftButtonDown"/>
<iMicClassBase:ColorPanel Color="#FF996C33" Margin="2" MouseLeftButtonDown="ColorPanel_MouseLeftButtonDown"/>
<iMicClassBase:CustomButton Name="btnMoreColor" Content="更多" FontSize="14"
Foreground="#FF56C255" ToolTip="点击获取更多颜色"
TextBlock.TextAlignment="Center"
Padding="1,2,1,1"
Height="25" Width="40" VerticalAlignment="Center" Click="btnMoreColor_Click"/>
</WrapPanel>
</StackPanel>
</TabItem>
<!--图片选项卡-->
<TabItem x:Name="TabItemImage" Header="图片" Cursor="Hand" Style="{DynamicResource TabItemStyle3}" >
<StackPanel Height="80" Width="180">
<Line x:Name="LINETWO" Stroke="#FF56C253" X1="73" Y1="0.5" X2="103" Y2="0.5" StrokeThickness="2"/>
<WrapPanel Height="44" ItemHeight="42" ItemWidth="42" Margin="6,15,6,10">
<iMicClassBase:SelectButton Name="btnBg1" Margin="2" Tag="1"
ButtonSelected="SelectButton_ButtonSelected">
<iMicClassBase:SelectButton.Background>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg1_nor.png" />
</iMicClassBase:SelectButton.Background>
<iMicClassBase:SelectButton.BackgroundDefault>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg1_nor.png" />
</iMicClassBase:SelectButton.BackgroundDefault>
<iMicClassBase:SelectButton.BackgroundInvalid>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg1_nor.png" />
</iMicClassBase:SelectButton.BackgroundInvalid>
<iMicClassBase:SelectButton.BackgroundOver>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg1_click.png" />
</iMicClassBase:SelectButton.BackgroundOver>
<iMicClassBase:SelectButton.BackgroundPress>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg1_click.png" />
</iMicClassBase:SelectButton.BackgroundPress>
<iMicClassBase:SelectButton.BackgroundSelect>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg1_click.png" />
</iMicClassBase:SelectButton.BackgroundSelect>
</iMicClassBase:SelectButton>
<iMicClassBase:SelectButton Name="btnBg2" Margin="2" Tag="2"
ButtonSelected="SelectButton_ButtonSelected">
<iMicClassBase:SelectButton.Background>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg2_nor.png" />
</iMicClassBase:SelectButton.Background>
<iMicClassBase:SelectButton.BackgroundDefault>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg2_nor.png" />
</iMicClassBase:SelectButton.BackgroundDefault>
<iMicClassBase:SelectButton.BackgroundInvalid>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg2_nor.png" />
</iMicClassBase:SelectButton.BackgroundInvalid>
<iMicClassBase:SelectButton.BackgroundOver>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg2_click.png" />
</iMicClassBase:SelectButton.BackgroundOver>
<iMicClassBase:SelectButton.BackgroundPress>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg2_click.png" />
</iMicClassBase:SelectButton.BackgroundPress>
<iMicClassBase:SelectButton.BackgroundSelect>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg2_click.png" />
</iMicClassBase:SelectButton.BackgroundSelect>
</iMicClassBase:SelectButton>
<iMicClassBase:SelectButton Name="btnBg3" Margin="2" Tag="3"
ButtonSelected="SelectButton_ButtonSelected">
<iMicClassBase:SelectButton.Background>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg3_nor.png" />
</iMicClassBase:SelectButton.Background>
<iMicClassBase:SelectButton.BackgroundDefault>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg3_nor.png" />
</iMicClassBase:SelectButton.BackgroundDefault>
<iMicClassBase:SelectButton.BackgroundInvalid>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg3_nor.png" />
</iMicClassBase:SelectButton.BackgroundInvalid>
<iMicClassBase:SelectButton.BackgroundOver>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg3_click.png" />
</iMicClassBase:SelectButton.BackgroundOver>
<iMicClassBase:SelectButton.BackgroundPress>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg3_click.png" />
</iMicClassBase:SelectButton.BackgroundPress>
<iMicClassBase:SelectButton.BackgroundSelect>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg3_click.png" />
</iMicClassBase:SelectButton.BackgroundSelect>
</iMicClassBase:SelectButton>
<iMicClassBase:SelectButton Name="btnBg4" Margin="2" Tag="4"
ButtonSelected="SelectButton_ButtonSelected">
<iMicClassBase:SelectButton.Background>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg4_nor.png" />
</iMicClassBase:SelectButton.Background>
<iMicClassBase:SelectButton.BackgroundDefault>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg4_nor.png" />
</iMicClassBase:SelectButton.BackgroundDefault>
<iMicClassBase:SelectButton.BackgroundInvalid>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg4_nor.png" />
</iMicClassBase:SelectButton.BackgroundInvalid>
<iMicClassBase:SelectButton.BackgroundOver>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg4_click.png" />
</iMicClassBase:SelectButton.BackgroundOver>
<iMicClassBase:SelectButton.BackgroundPress>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg4_click.png" />
</iMicClassBase:SelectButton.BackgroundPress>
<iMicClassBase:SelectButton.BackgroundSelect>
<ImageBrush ImageSource="/iMicClassBase;component/Images/HomeToolControlImages/bgimg4_click.png" />
</iMicClassBase:SelectButton.BackgroundSelect>
</iMicClassBase:SelectButton>
</WrapPanel>
</StackPanel>
</TabItem>
<!--本地选项卡-->
<TabItem x:Name="TabItemLocal" Header="本地" Cursor="Hand" Style="{DynamicResource TabItemStyle3}" >
<StackPanel Height="80" Width="180">
<Line x:Name="LINETHR" Stroke="#FF56C253" X1="128" Y1="0.5" X2="158" Y2="0.5" StrokeThickness="2"/>
<iMicClassBase:CustomButton Name="btnAddLoaclImage" Margin="0,18" Content="选择本地" Padding="8,4,8,4"
Click="btnAddLoaclImage_Click" Height="30" Width="80"/>
</StackPanel>
</TabItem>
</TabControl>
</Border>
</Grid>
</UserControl>
其实用户控件是我们常用的，没什么可说的，在此做个说明，只想保持博文队形整齐。
自定义控件系列博文链接：
WPF自定义控件（一）の控件分类
WPF自定义控件（二）の重写原生控件样式模板
WPF自定义控件（三）の扩展控件
WPF自定义控件（四）の自定义控件
WPF自定义控件（五）の用户控件
以上是关于WPF自定义控件の用户控件（完结）的主要内容，如果未能解决你的问题，请参考以下文章