WPF实现选项卡效果(1)——使用AvalonDock

WPF实现选项卡效果(1)——使用AvalonDock简介  公司最近一个项目,软件采用WPF开发,需要实现类似于VS的选项卡(或者是浏览器的选项卡)效果。搜寻诸多资料后,发现很多同仁推荐AvalonDock这款开源控件。在其官方地址下载源码和Demo后,对其进行了初步的研究,初步实现了预期效果。  完整系列  ●第一部分  ●第二部分  ●第三部分  在Git中下载工程源码AvalonDocking的结构树  在下载的Dem

大家好,又见面了,我是你们的朋友全栈君。

简介

  公司最近一个项目,软件采用WPF开发,需要实现类似于VS的选项卡(或者是浏览器的选项卡)效果。搜寻诸多资料后,发现很多同仁推荐AvalonDock这款开源控件。在其官方地址下载源码和Demo后,对其进行了初步的研究,初步实现了预期效果。
  完整系列
  ● 第一部分
  ● 第二部分
  ● 第三部分
  在Git中下载工程源码

AvalonDocking的结构树

  在下载的Demo中,我们可以发现AvalonDock的可视化结构树如下:

<avalon:DockingManager x:Name="dockingManager">
            <avalon:LayoutRoot>
                <avalon:LayoutPanel Orientation="Horizontal">
                    <avalon:LayoutDocumentPane DockWidth="300">
                        <avalon:LayoutAnchorable Title="Sample Tool Pane">
                            <TextBox />
                        </avalon:LayoutAnchorable>
                    </avalon:LayoutDocumentPane>
                </avalon:LayoutPanel>
            </avalon:LayoutRoot>
        </avalon:DockingManager>
Created with Raphaël 2.1.0 AvalonDock 可视化结构树 DockingManager DockingManager LayoutRoot LayoutRoot LayoutPanel LayoutPanel LayoutDocumentPane LayoutDocumentPane LayoutAnchorable LayoutAnchorable Content Content 承载 承载 承载 承载 我们需要的内容

我们来做一个Demo

Step 1-创建WPF项目

  在Visual Studio中新建一个WPF项目,然后打开MainWindow.xaml文件,修改其代码如下:  

<Window x:Class="AvalonProject.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:avalon="http://schemas.xceed.com/wpf/xaml/avalondock" Title="MainWindow" Height="600" Width="800">
    <Grid>
        <avalon:DockingManager x:Name="dockingManager">
            <avalon:LayoutRoot>
                <avalon:LayoutPanel Orientation="Horizontal">
                    <avalon:LayoutDocumentPane DockWidth="300">
                        <avalon:LayoutAnchorable Title="Sample Tool Pane">
                            <TextBox />
                        </avalon:LayoutAnchorable>
                    </avalon:LayoutDocumentPane>
                </avalon:LayoutPanel>
                <avalon:LayoutRoot.LeftSide>
                    <avalon:LayoutAnchorSide>
                        <avalon:LayoutAnchorGroup>
                            <avalon:LayoutAnchorable Title="Autohidden Content">
                                <TextBox />
                            </avalon:LayoutAnchorable>
                        </avalon:LayoutAnchorGroup>
                    </avalon:LayoutAnchorSide>
                </avalon:LayoutRoot.LeftSide>
            </avalon:LayoutRoot>
        </avalon:DockingManager>
    </Grid>
</Window>

Step 2-添加AvalonDock引用

  在刚刚建好的项目中,添加Xceed.Wpf.AvalonDock引用。
  我们回顾上面的xaml代码,其中有一句代码:

xmlns:avalon="http://schemas.xceed.com/wpf/xaml/avalondock"

  这一句就是xaml代码对AvalonDock命名控件的引用,只有添加这一句才能在xaml代码中对AvalonDock的控件进行使用。

Step 3-运行程序

  运行程序,我们发现效果如下:
  这里写图片描述
  这里写图片描述

总结

  在上面的代码中,我们没有书写任何C#代码,利用AvalonDock初步实现了我们需要的选项卡效果。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/162148.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 模型矩阵、视图矩阵、投影矩阵

    模型矩阵、视图矩阵、投影矩阵模型视图投影矩阵的作用,就是将顶点从局部坐标系转化到规范立方体(CanonicalViewVolnme)中。总而言之,模型视图投影矩阵=投影矩阵×视图矩阵×模型矩阵,模型矩阵将顶点从局部坐标系转化到世界坐标系中,视图矩阵将顶点从世界坐标系转化到视图坐标系下,而投影矩阵将顶点从视图坐标系转化到规范立方体中。如下图所示,假设现在要将三维空间中的三角形渲染到屏幕上。三角形的模型文件中,顶点坐标是…

    2022年5月14日
    78
  • GIT、GITLAB、GITHUB、GITLIB[通俗易懂]

    GIT、GITLAB、GITHUB、GITLIB[通俗易懂]Git是一款免费、开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。Git是一个开源的分布式版本控制系统,可以有效、高速的处理从很小到非常大的项目版本管理。Github-一个网站,提供给用户空间创建git仓储,保存用户的一些数据文档或者代码等作为开源代码库以及版本控制系统,Github目前拥有140多万开发者用户。随着越来越多的应用程序转移到了云上

    2025年5月31日
    2
  • MySQL索引原理及BTree(B-/+Tree)结构详解「建议收藏」

    MySQL索引原理及BTree(B-/+Tree)结构详解「建议收藏」目录摘要数据结构及算法基础索引的本质B-Tree和B+TreeB-TreeB+Tree带有顺序访问指针的B+Tree为什么使用B-Tree(B+Tree)主存存取原理磁盘存取原理局部性原理与磁盘预读B-/+Tree索引的性能分析MySQL索引实现MyISAM索引实现InnoDB索引实现索引使用策略及优化示例数据库最左前缀原理与…

    2022年6月24日
    27
  • WPF 实现测量显示文本长度

    WPF 实现测量显示文本长度

    2021年6月14日
    171
  • python基础(7)内置函数divmod用法

    python基础(7)内置函数divmod用法前言我们都知道,python中//代表整数运算中的取整,%代表整数运算中的取余,那么有什么函数可以同时取到整数和余数吗?答案是有的,使用python内置函数divmoddivmod首先看一下源

    2022年8月7日
    4
  • Python sorted 函数

    Python sorted 函数Pythonsorted函数sorted可以对所有可迭代的对象进行排序操作,sorted方法返回的是一个新的list,而不是在原来的基础上进行的操作。从新排序列表。sorted语法:

    2022年7月6日
    24

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号