WPF之Canvas不能添加ScrollViewer问题的终极解决方案

最新推荐文章于 2024-05-30 16:01:14 发布
最新推荐文章于 2024-05-30 16:01:14 发布
阅读量2.3k 收藏 1
点赞数
分类专栏： WPF 文章标签： WPF WPF之Canvas不能添加滑动条解决方法 ScrollViewer 如何给Canvas添加滑动条 WPF通过给容器添加滑动条来实现浏览子控件
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38963614/article/details/90486333
版权

**前言?*本人是个学习WPF的新手，期间遇到了很多问题，今天在项目上遇到了一个特别麻烦的问题，就是Canvas不能添加滑动条，我原先的想法是用Canvas作为父容器，之所以采用Canvas作为父容器，是因为它可以实现绝对布局，可以方便的通过程序来控制子控件的位置，可以实现动态的往里面添加图片，然后可以加个滚动条实时的浏览传过来的图片，如果跟我有相同想法的朋友可以看一下我在实现这个功能的过程中遇到的种种问题。最后经过一系列的查找资料，不断的调试程序终于解决了。

（1）通过查找资料说可以给Canvas加个StackPanel,于是我尝试了一下，代码布局如下:

 <ScrollViewer Height="845"
                HorizontalScrollBarVisibility="Auto"
                  VerticalScrollBarVisibility="Visible">
        <StackPanel Height="Auto" Width="1395" x:Name="stackPanelFather">
        <Canvas x:Name="father" Width="1395" Height="Auto" SizeChanged="Father_SizeChanged">
        </Canvas>
        </StackPanel>
    </ScrollViewer>

我的想法很简单，将Canvas的Height设置成Auto，这样就可以动态的往里面添加图片了，然后在Canvas外层加了一个StackPanel，也不限定它的高度，这种做法相当于是给StackPanel加了滑动条，它里面只有Canvas这一个子控件，虽然子控件的高度并没有限制，但是你会发现，你主窗体的高度却限制住了它，调式的结果是只能显示主窗体高度的图片数，有点小失望，然后果断的抛弃了这种方法
(2)第二种方法替换Canvas,采用WrapPanel，提前做一个用户控件用来存放图片，然后将该用户控件添加到WrapPanel中。为什么要做一个用户控件来存放图片呢？，因为用户控件格式和布局可以自己设置，而WrapPanel不好设置子控件的位置，所以提前将模板做好，之后直接放入到WrapPanel中就好。代码布局如下：

<ScrollViewer Height="845"
                HorizontalScrollBarVisibility="Auto"
                  VerticalScrollBarVisibility="Visible">
        <WrapPanel Orientation="Horizontal" x:Name="stackPanelFather" Width="1395" Height="Auto" SizeChanged="Father_SizeChanged">

        </WrapPanel>
    </ScrollViewer>

当然了动态的添加图片和刷新图片的过程需要用到委托机制，但是不管怎样最后还是顺利的解决了这个问题。
(3)最后贴一个实现的效果图：在这里插入代码片在这里插入图片描述
欢迎评论和留言，具体的代码实现逻辑这里就不做详细介绍了，有想知道怎么实现的可以给我留言，我一般都会回复的~~

歌未晚
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
WPF Canvas缩放后显示滚动条
XinShun的博客
07-28 1122
1、参考：https://social.msdn.microsoft.com/Forums/vstudio/en-US/0820008b-4ccd-4285-bcb7-129f5d8ff75d/canvas-zoom-by-mouse-wheel-but-scroll-bar-not-working-?forum=wpf https://www.cnblogs.com/wywnet/p/3993161.html 主要使用： canvas.LayoutTransform = st; 而不是： c
WPF ScrollViewer样式 滚动时显示滚动条
09-28
滚动时显示滚动条,其他时候隐藏样式，滚动条为细窄边框
ScrollViewer—WPF滚动条控件
最新发布
小芦荟同学的博客
05-30 1214
ScrollViewer—WPF滚动条控件 ScrollViewer定义与功能、 ScrollViewer使用、ScrollViewer常用属性、滚动类型、用Button来控制ScrollViewer的滚动
WPF中Canvas滚动条
XiaoCai
02-23 2000
<UserControl x:Class="GraphAlgorithm.UCGraphCanvas" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.o
WPF 在ScrollViewer控件内部的Slider控件无法触摸滑动
log103628的博客
07-27 1170
WPF中在ScrollViewer控件内部的Slider控件无法触摸滑动，是由于ScrollViewer控件默认设置了IsManipulationEnabled为True。 <ScrollViewer x:Name="ScrollViewer1"> <Slider></Slider> </Scro...
WPF实现ScrollViewer滚动到指定控件处
10-19
在WPF开发中，ScrollViewer控件用于提供可滚动的视图，允许用户查看超过屏幕范围的内容。然而，有时我们需要在程序逻辑中自动控制ScrollViewer滚动到特定的子控件，比如用户完成某个操作后自动定位到指定内容。本文...
WPF 左菜单 鼠标移动 滚动 菜单 Canvas
05-11
在本文中，我们将深入探讨如何在WPF（Windows Presentation Foundation）中实现一个具有鼠标移动和滚动功能的左侧面板菜单，使用Canvas作为布局容器。这个菜单不仅提供了视觉上的交互性，还能通过鼠标滚动来轻松浏览...
WPF Canvas 效果 倾斜视觉差1
05-12
在本文中，我们将深入探讨WPF（Windows Presentation Foundation）中的Canvas元素以及如何创建倾斜的视觉差效果。Canvas是WPF中的一个布局面板，允许我们精确地控制子元素的位置，这在构建复杂的图形和动画时非常...
wpf 后台添加控件（多个）
11-15
本教程将基于标题“wpf 后台添加控件（多个）”和描述中的内容，详细介绍如何在WPF应用的后台代码中动态地添加多个控件，并实现滚动条效果。 首先，我们要理解WPF中的控件创建。在XAML中，我们通常静态地定义界面...
ScrollViewer中的WPF简单缩放和拖动支持
04-11
一个示例，描述了用鼠标滚轮或滑块缩放并拖动由ScrollViewer托管的有限内容的方法。
wpf 可缩放的canvas
06-02
这个是转的一个可缩放的canvas例子，可以直接用，很方便
WPF 鼠标拖动图片放大缩小
07-19
WPF 鼠标拖动图片放大缩小 添加图片->然后选择添加的图片->鼠标进行放大缩小->属性面板值变更
WPF中的可以实现缩放拖拽功能的布局控件
12-24
基于Canvas编写的 布局控件 可以实现 以鼠标为中心滚轮缩放 左键拖拽功能
wpF布局容器添加滚动条
weixin_34223655的博客
05-15 906
把布局容器添加到ScrollViewer中，可以实现布局容器滚动的效果：代码如下： Canvas tCanvas = new Canvas; m_ScrollViewer.VerticalScrollBarVisibility = ScrollBarVisibility.Disabled; m_ScrollViewer.HorizontalScrollBarVisibilit...
WPF Canvas实现进度条
weixin_30734435的博客
11-21 179
先看效果图： 思路： 一个Canvas做背景，一个Canvas用来显示进度，图片放在显示进度的Canvas中，靠右设置为图片本身宽度一半的距离，视觉上实现以图片中轴线为原点 前台代码： <Window x:Class="ProgressMask.MainWindow" xmlns="http://schemas.microsoft.com/winfx/200...
8天入门wpf—— 第五天 数据绑定
weixin_34345753的博客
06-30 128
             在webform中，如果提到“绑定”二字，相信大家都不会陌生，绑定，让我们的代码更加的简洁优美，在wpf中也存在各种神马的绑定， 当然使用上都是行隔理不隔。       一： 控件到控件的绑定      既然是绑定，那么肯定就有”源对象“和”目标对象“两种状态实体，从图的角度上来说存在三种状态： 确实在wpf中存在这三种模式的对应方式， 1：OneWay...
scrollbar wpf 高度_WPF Canvas标尺滚动条问题
weixin_39617484的博客
12-21 300
我能想到这样做的最好的方式是通过使一个自定义的控件来封装像以下行为：public class RulerScrollViewer : ScrollViewer{static RulerScrollViewer(){DefaultStyleKeyProperty.OverrideMetadata(typeof(RulerScrollViewer), new FrameworkPropertyMeta...
WPF 中Canvas中添加事件按住鼠标移动时不能超过Canvas的边界
06-08
在 WPF 中，可以使用 `Canvas` 控件的 `MouseMove` 事件和 `MouseLeftButtonDown`、`MouseLeftButtonUp` 事件结合起来实现鼠标在 `Canvas` 控件中按住移动时不能超过 `Canvas` 边界的效果。 具体实现可以参考以下代码： ```xaml <Canvas x:Name="canvas" Width="300" Height="200" Background="White" MouseLeftButtonDown="Canvas_MouseLeftButtonDown" MouseMove="Canvas_MouseMove" MouseLeftButtonUp="Canvas_MouseLeftButtonUp" /> ``` ```csharp private bool isDrawing = false; private Point startPoint; private Point endPoint; private void Canvas_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) { isDrawing = true; startPoint = e.GetPosition(canvas); } private void Canvas_MouseMove(object sender, MouseEventArgs e) { if (isDrawing) { endPoint = e.GetPosition(canvas); // 计算鼠标在 Canvas 中的坐标，并限制移动范围 double x = Math.Min(Math.Max(endPoint.X, 0), canvas.ActualWidth); double y = Math.Min(Math.Max(endPoint.Y, 0), canvas.ActualHeight); // 绘制路径 Line line = new Line { Stroke = Brushes.Black, X1 = startPoint.X, Y1 = startPoint.Y, X2 = x, Y2 = y }; canvas.Children.Add(line); // 更新起点坐标 startPoint = new Point(x, y); } } private void Canvas_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) { isDrawing = false; } ``` 在上述代码中，我们在 XAML 中定义了一个 `Canvas` 控件，并添加了 `MouseLeftButtonDown`、`MouseMove`、`MouseLeftButtonUp` 事件的处理函数。当鼠标左键按下时，设置 `isDrawing` 为 `true`，并记录下起点坐标。当鼠标移动时，如果 `isDrawing` 为 `true`，则计算出鼠标在 `Canvas` 中的坐标，并限制移动范围。然后绘制路径，并更新起点坐标。当鼠标左键抬起时，设置 `isDrawing` 为 `false`，结束绘制。 注意，WPF 中的 `Canvas` 控件大小可以通过 `Width` 和 `Height` 属性来设置，但实际大小可能会受到父控件的布局影响。因此，在计算鼠标在 `Canvas` 中的坐标时，需要使用 `ActualWidth` 和 `ActualHeight` 属性来获取 `Canvas` 控件的实际大小。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值