C# wpf 附加属性实现任意控件拖动调整大小

这篇具有很好参考价值的文章主要介绍了C# wpf 附加属性实现任意控件拖动调整大小。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

WPF拖动改变大小系列

第一节 Grid内控件拖动调整大小
第二节 Canvas内控件拖动调整大小
第三节 窗口拖动调整大小
第四节 附加属性实现拖动调整大小(本章)
第五章 拓展更多调整大小功能



前言

前面几节讲了控件拖动改变大小的几种方法,根据不同的布局可以有不同的实现方式。本节主要讲的是利用附加属性对这些方式进行封装,实现复用性,否则直接添加装饰器的方式需要写cs代码较为麻烦,且不方便移植,实现起来很不方便。通过将上述几节的所有功能整合到附加属性中,增加灵活度和适用性。

一、如何实现?

1.定义附加属性

定义附加属性IsResizeable,用于指示控件是否可调整大小,ResizeTemplate用指定拖动控件的样式,实现界面业务分离。
IsResizeable:

public static bool GetIsResizeable(DependencyObject obj)
{
    return (bool)obj.GetValue(IsResizeableProperty);
}
public static void SetIsResizeable(DependencyObject obj, bool value)
{
    obj.SetValue(IsResizeableProperty, value);
}

// Using a DependencyProperty as the backing store for IsResizeable.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty IsResizeableProperty =
    DependencyProperty.RegisterAttached("IsResizeable", typeof(bool), typeof(Resize), new PropertyMetadata(false));

ResizeTemplate:

public static ControlTemplate GetResizeTemplate(DependencyObject obj)
{
    return (ControlTemplate)obj.GetValue(ResizeTemplateProperty);
}

public static void SetResizeTemplate(DependencyObject obj, ControlTemplate value)
{
    obj.SetValue(ResizeTemplateProperty, value);
}

// Using a DependencyProperty as the backing store for ResizeTemplate.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty ResizeTemplateProperty =
    DependencyProperty.RegisterAttached("ResizeTemplate", typeof(ControlTemplate), typeof(Resize), new PropertyMetadata(null));

2.整合功能

系列文章中的前三章节都是讲述wpf的各种控件拖动改变大小的方法,都使用了Thumb以及其DragDelta事件,所以将它们整合到一起还是比较容易的。具体代码可参考前面四章的内容。
整合的方法有很多种比如使用Switch的方式:

private void Thumb_DragDelta(object sender, DragDeltaEventArgs e)
{
    switch (_resizeType)
    {
        case ResizeType.None:
            break;
        case ResizeType.Window:
         //Window拖动调整大小逻辑,参考第三节《窗口拖动调整大小》
            break;
        case ResizeType.Canvas:
        //Canvas内控件拖动调整大小逻辑,参考第二节《Canvas内控件拖动调整大小》
            break;    
        case ResizeType.Grid:
        case ResizeType.Others:
        //Grid或其他容器内控件拖动调整大小逻辑,参考第一节《Grid内控件拖动调整大小》
            break;
    }
}

3.关联功能

在附加属性IsResizeable的改变事件中关联拖动代码,判断不同的控件并注册事件。

public void PropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
//1.查找Thumb,或生成Thumb,添加到用控件的装饰层
//2.注册Thumb事件
}

二、完整代码

https://download.csdn.net/download/u013113678/58844466


三、使用示例

1.拖动控件大小

(1)、默认样式
默认样式中,会给控件添加一个装饰器里面包含8个方位的透明控件用于拖动。
示例代码:
Grid中

 <Grid>
     <Rectangle  Width="120" Height="120" Fill="Wheat"  local:Resize.IsResizeable="True"/>
 </Grid>

Canvas中

 <Canvas>
     <Rectangle  Width="120" Height="120" Fill="Wheat"  local:Resize.IsResizeable="True"/>
 </Canvas>

其他容器中

 <StackPanel>
     <Rectangle  Width="120" Height="120" Fill="Wheat"  local:Resize.IsResizeable="True"/>
 </StackPanel>

效果预览如下:
C# wpf 附加属性实现任意控件拖动调整大小
(2)、自定义样式
自定义样式使用规则为:
1、给ResizeTemplate属性赋值自定义的ControlTemplate。
2、ControlTemplate中二级控件的Thumb自动被用于拖动。
3、Thumb的数量不限,拖动方向由HorizontalAlignment和VerticalAlignment决定。
示例如下:

<Grid>
    <Rectangle  Width="120" Height="120" Fill="Wheat"  local:Resize.IsResizeable="True" local:Resize.ResizeTemplate="{DynamicResource PART_Resizeable_Thumbs}">
        <Rectangle.Resources>
            <ControlTemplate x:Key="PART_Resizeable_Thumbs">
                <Grid >
                    <!--左-->
                    <Thumb  Margin="-8,0,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Center" Cursor="SizeWE">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--上-->
                    <Thumb  Margin="0,-8,0,0" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Top" Cursor="SizeNS">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray"  BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--右-->
                    <Thumb  Margin="0,0,-8,0" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Center" Cursor="SizeWE">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--下-->
                    <Thumb  Margin="0,0,0,-8" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Bottom" Cursor="SizeNS">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--左上-->
                    <Thumb  Margin="-8,-8,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Top" Cursor="SizeNWSE">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--右上-->
                    <Thumb  Margin="0,-8,-8,0" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Top"  Cursor="SizeNESW">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--右下-->
                    <Thumb  Margin="0,0,-8,-8" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Bottom"  Cursor="SizeNWSE">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White" ></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                    <!--左下-->
                    <Thumb  Margin="-8,0,0,-8" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Bottom" Cursor="SizeNESW">
                        <Thumb.Template>
                            <ControlTemplate>
                                <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                            </ControlTemplate>
                        </Thumb.Template>
                    </Thumb>
                </Grid>
            </ControlTemplate>
        </Rectangle.Resources>
    </Rectangle>
</Grid>

效果预览:
C# wpf 附加属性实现任意控件拖动调整大小

2.拖动窗口大小

(1)、默认样式
代码:

<Window x:Class="WpfControlMove.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:WpfControlMove"
        mc:Ignorable="d"
        Title="MainWindow" Height="360" Width="640"                
        Background="Transparent"       
        WindowStyle="None"
        AllowsTransparency="True"
        local:Resize.IsResizeable="True"
        >
    <Grid  Margin="10" Background="White">
        <Grid.Effect>
            <DropShadowEffect Color="#FFAAAAAA" ShadowDepth="0" BlurRadius="10" Opacity="0.4" />
        </Grid.Effect>
    </Grid>
</Window>

效果预览:C# wpf 附加属性实现任意控件拖动调整大小

(2)、自定义样式
自定义样式的方法上面以及说明,在此处不再赘述。
示例代码:

<Window x:Class="WpfControlMove.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:WpfControlMove"
        mc:Ignorable="d"
        Title="MainWindow" Height="360" Width="640"              
        Background="Transparent"    
        AllowsTransparency="True"
        WindowStyle="None"
        local:Resize.IsResizeable="True"  
        local:Resize.ResizeTemplate="{DynamicResource PART_Resizeable_Thumbs}"
        >
    <Window.Resources>
        <ControlTemplate x:Key="PART_Resizeable_Thumbs">
            <Grid >
                <!--左-->
                <Thumb  Margin="-8,0,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Center" Cursor="SizeWE">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
                <!--上-->
                <Thumb  Margin="0,-8,0,0" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Top" Cursor="SizeNS">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray"  BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
                <!--右-->
                <Thumb  Margin="0,0,-8,0" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Center" Cursor="SizeWE">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
                <!--下-->
                <Thumb  Margin="0,0,0,-8" Width="16" Height="16" HorizontalAlignment="Center" VerticalAlignment="Bottom" Cursor="SizeNS">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>

                <!--左上-->
                <Thumb  Margin="-8,-8,0,0" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Top" Cursor="SizeNWSE">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
                <!--右上-->
                <Thumb  Margin="0,-8,-8,0" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Top"  Cursor="SizeNESW">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
                <!--右下-->
                <Thumb  Margin="0,0,-8,-8" Width="16" Height="16" HorizontalAlignment="Right" VerticalAlignment="Bottom"  Cursor="SizeNWSE">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White" ></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
                <!--左下-->
                <Thumb  Margin="-8,0,0,-8" Width="16" Height="16" HorizontalAlignment="Left" VerticalAlignment="Bottom" Cursor="SizeNESW">
                    <Thumb.Template>
                        <ControlTemplate>
                            <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="8"  Background="White"></Border>
                        </ControlTemplate>
                    </Thumb.Template>
                </Thumb>
            </Grid>
        </ControlTemplate>
    </Window.Resources>
    <Grid  Margin="10" Background="White">
        <Grid.Effect>
            <DropShadowEffect Color="#FFAAAAAA" ShadowDepth="0" BlurRadius="10" Opacity="0.4" />
        </Grid.Effect>
    </Grid>
</Window>

效果预览:

C# wpf 附加属性实现任意控件拖动调整大小


总结

总得来说将拖动大小功能封装成一共附加属性是很有用的。首先是具有通用性,在不同的窗口以及不同的项目中都可以使用,同时也减少了代码维护量,修改时只需要集中改一出即可,然后使用方法也是比较简单直接。文章来源地址https://www.toymoban.com/news/detail-504507.html

到了这里,关于C# wpf 附加属性实现任意控件拖动调整大小的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • 在WPF应用中使用GongSolutions.WPF.DragDrop实现列表集合控件的拖动处理

    WPF应用中,控件本身也可以通过实现事件代码实现拖动的处理,不过如果我们使用GongSolutions.WPF.DragDrop来处理,事情会变得更加简单轻松,它支持很多控件的拖动处理,如ListBox, ListView, TreeView, DataGrid等源自ItemsControl的控件,本篇随笔介绍在工作流模块中拖动TreeView和DataGrid列表

    2024年02月05日
    浏览(33)
  • django boostrap html实现可拖拽的左右布局,鼠标拖动调整左右布局的大小或占比

          最近需要在Django项目中,实现一个左右布局的html页面,页面框架使用的是boostrap。但这个布局不是简单的左右分栏布局,而是需要实现可以通过鼠标拖拽的方式动态调整左右两侧布局的大小和占比。效果大致如下:         一开始,页面分为左右两块布局:   鼠标放

    2024年02月13日
    浏览(30)
  • WPF中依赖属性及附加属性的概念及用法

    完全来源于十月的寒流,感谢大佬讲解 由依赖属性提供的属性功能 与字段支持的属性不同,依赖属性扩展了属性的功能。 通常,添加的功能表示或支持以下功能之一: 资源 数据绑定 样式 动画 元数据重写 属性值继承 WPF 设计器集成 TextBox HasText实现一 TextBox HasText只读实现二

    2024年02月05日
    浏览(29)
  • 实现WPF客户端程序窗体大小随着任务栏的显示与隐藏自动调整为全屏

    要实现WPF客户端程序窗体大小随着任务栏的显示与隐藏自动调整为全屏,可以使用以下步骤: 在窗体的代码文件中,订阅 SystemParameters.StaticPropertyChanged 事件,该事件会在任务栏显示或隐藏时触发。 这样,当任务栏显示或隐藏时,窗体的高度将自动调整为全屏或屏幕可用工作

    2024年02月13日
    浏览(28)
  • 浅谈WPF之控件拖拽与拖动

    使用过office的visio软件画图的小伙伴都知道,画图软件分为两部分,左侧图形库,存放各种图标,右侧是一个画布,将左侧图形库的图标控件拖拽到右侧画布,就会生成一个新的控件,并且可以自由拖动。那如何在WPF程序中,实现类似的功能呢?今天就以一个简单的小例子,

    2024年02月05日
    浏览(50)
  • vue - 【让一张图片可以拖动】鼠标点击拖曳拖拽图片及鼠标滚轮放大缩小功能实现,让一张图片图像在页面内可以任意拖动拖曳及鼠标滚轮可以缩放控制大小功能效果(完整实例源码,一键复制开箱即用!)

    在vue网页h5项目开发中,实现一个图片图像可用鼠标拖曳拖拽位置,并且用鼠标滚轮可以放大缩小图片。 一键复制代码,开箱即用。 找个页面,复制粘贴。

    2024年02月13日
    浏览(47)
  • C# winform usercontrol控件跟随主窗体实现自动大小

    usercontrol控件跟随主窗体实现自动大小 今天是跟着哗哩哗哩大学学习C的第N天,但是是学习usercontrol的第一天。 第一天遇到的问题就是如何将usercontrol的大小跟随主窗体的一起变大变小。视频中教得很详细,首先是将usercontrol控件实例化,接着就是设置usercontrol的dock属性为fil

    2024年02月12日
    浏览(36)
  • QT学习笔记:调整控件大小和位置

    前面的文章,我讲了怎么用layout去布局。但布局做完后,发现界面有点怪。比如,最低下的“清除”按钮这么大,“消息体”这个label没有位于中间等。下面,我就来讲下怎么把界面继续优化。 1、调整“清除”按钮大小和位置 (1)在“sizePolicy”中,选择Fixed。 (2)把左边

    2024年02月12日
    浏览(45)
  • C# wpf利用Clip属性实现截屏框

    第一章 使用GDI+实现截屏 第二章 制作截屏框(本章) ______第一节 使用DockPanel制作截屏框 ______第二节 利用Clip属性实现截屏框(本节) 第三章 实现截屏框热键截屏 第四章 实现截屏框实时截屏 第五章 使用ffmpeg命令行实现录屏 第一节已经实现过截屏框,实现方法相对简单,也仅

    2024年01月23日
    浏览(31)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包