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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • hibernate中query.uniqueResult()

    hibernate中query.uniqueResult()Queryq=session.createQuery(“selectt,pfromTeachert,Personpwheret.personid=p.id”);得到的两个对象组成的数组

    2022年7月2日
    20
  • jdbc访问mysql(百度app下载)

     MySQL下载地址:http://dev.mysql.com/downloads/mysql/5.1.html#downloads 选择你对应的操作系统,然后选择这个系统下的第一个或者第二个,点击Pickamirror后即可下载 MySQL的JDBC驱动下载地址:http://dev.mysql.com/downloads/connector/在页面中选择你对应的开

    2022年4月10日
    33
  • docker部署web项目_docker构建高可用web应用

    docker部署web项目_docker构建高可用web应用前言前面我们运行的容器并没有一些什么特别的用处。接下来让我们尝试使用docker构建一个web应用程序。我们将在docker容器中运行一个PythonFlask应用来运行一个web

    2022年7月30日
    3
  • BigDecimal类型 比较大小的方法[通俗易懂]

    BigDecimal类型 比较大小的方法[通俗易懂]1.转成intBigDecimalb1=newBigDecimal(“-121454125453.145”);if(b1.intValue()<0){ System.out.println(“金额为负数!”); System.out.println(b1);}2.compareTo方法结果是:-1:小于;0:等于;1:大于;BigDecimalb1=newBigDecimal(“-121454125453.145”);if(b1.compar

    2022年7月14日
    35
  • winform 自定义控件_adratator控件

    winform 自定义控件_adratator控件有很多时候,开发winform,系统给的控件往往不能满足需求,所以,

    2022年10月21日
    0
  • 无键盘屏幕配置树莓派连接WiFi

    无键盘屏幕配置树莓派连接WiFi前言Ubuntu20.04LTS都发布好一段时间了,官方支持RaspberryPi,手痒痒了想试试,结果发现没带miniHDMI的转接线,看了下Ubuntu官方的树莓派安装文档:https://ubuntu.com/tutorials/how-to-install-ubuntu-on-your-raspberry-pi#1-overview可以直接在TF卡根目录下面创建配置文件来实现WiFi连接的.记录一下实操过程Ubuntu20.04LTS系统镜像写入TF卡习惯了先手动下载系统镜像:

    2022年6月13日
    24

发表回复

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

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