我的编程空间,编程开发者的网络收藏夹
学习永远不晚

基于WPF实现面包屑效果的示例代码

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

基于WPF实现面包屑效果的示例代码

WPF 简单实现面包屑

框架使用.NET4 至 .NET6

Visual Studio 2022;

面包屑展示使用控件如下:

  • Button 做首页按钮,当点击时回到首页。
  • ItemsControl 做面包屑 Item 展示,DataTemplate -> Hyperlink > 做点击时回到当前 Item

ListView 展示当前 Item 的子项,也可以换做 ListBox 控件或其他。

效果图

实现代码

1)创建 BreadCrumbBarExample.xaml 代码如下:

<wd:Window x:Class="WpfApp1.BreadCrumbBarExample"
        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:wd="https://github.com/WPFDevelopersOrg/WPFDevelopers"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="BreadCrumbBarExample - 面包屑" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid Margin="0,5">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Button Style="{StaticResource PathButton}" ToolTip="主页"
                    Click="btnHome_Click" Cursor="Hand">
                <Path Data="M804.571 566.857v274.286q0 14.857-10.857 25.714t-25.714 10.857h-219.429v-219.429h-146.286v219.429h-219.429q-14.857 0-25.714-10.857t-10.857-25.714v-274.286q0-0.571 0.286-1.714t0.286-1.714l328.571-270.857 328.571 270.857q0.571 1.143 0.571 3.429zM932 527.429l-35.429 42.286q-4.571 5.143-12 6.286h-1.714q-7.429 0-12-4l-395.429-329.714-395.429 329.714q-6.857 4.571-13.714 4-7.429-1.143-12-6.286l-35.429-42.286q-4.571-5.714-4-13.429t6.286-12.286l410.857-342.286q18.286-14.857 43.429-14.857t43.429 14.857l139.429 116.571v-111.429q0-8 5.143-13.143t13.143-5.143h109.714q8 0 13.143 5.143t5.143 13.143v233.143l125.143 104q5.714 4.571 6.286 12.286t-4 13.429z"
                      Stretch="Uniform" Width="15"
                      Fill="{StaticResource PrimaryTextSolidColorBrush}"/>
            </Button>
            <ScrollViewer HorizontalScrollBarVisibility="Auto"
                          Grid.Column="1">
                <ItemsControl ItemsSource="{Binding BreadCrumbBars}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel Orientation="Horizontal"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <TextBlock VerticalAlignment="Center">
                                <Hyperlink Click="Hyperlink_Click"
                                           Cursor="Hand">
                                    <Run Text="{Binding Name}"/>
                                </Hyperlink>
                                <Run Text=" > "/>
                            </TextBlock>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>
        </Grid>
        <ListView ItemsSource="{Binding Files}" Grid.Row="1"
                  SelectedItem="{Binding FilesSelectedItem}"
                  Name="FilesListView">
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="Name" 
                                    DisplayMemberBinding="{Binding Name}" 
                                    Width="200"/>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</wd:Window>

2) BreadCrumbBarExample.xaml.cs 代码如下:

  • BreadCrumbBars 记录面包屑的值。
  • Files 记录当前的子项。
  • 当点击面包屑则删除当前至末尾的所有数据 List.RemoveRange(0, List.Count - 0);
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Diagnostics;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace WpfApp1
{
    /// <summary>
    /// BreadCrumbBarExample.xaml 的交互逻辑
    /// </summary>
    public partial class BreadCrumbBarExample : INotifyPropertyChanged
    {
        private ObservableCollection<FolderItem> files;
        public ObservableCollection<FolderItem> Files
        {
            get { return files; }
            set { files = value; OnPropertyChanged(); }
        }

        private ObservableCollection<FolderItem> breadCrumbBars;
        public ObservableCollection<FolderItem> BreadCrumbBars
        {
            get { return breadCrumbBars; }
            set { breadCrumbBars = value; OnPropertyChanged(); }
        }

        private FolderItem filesSelectedItem;
        public FolderItem FilesSelectedItem
        {
            get { return filesSelectedItem; }
            set { filesSelectedItem = value; OnPropertyChanged(); }
        }

        public BreadCrumbBarExample()
        {
            InitializeComponent();
            FilesListView.SelectionChanged += FilesListView_SelectionChanged;
            DataContext = this;
            BreadCrumbBars = new ObservableCollection<FolderItem>();
            Files = new ObservableCollection<FolderItem>();
            Loaded += BreadCrumbBarExample_Loaded;
        }

        private void BreadCrumbBarExample_Loaded(object sender, RoutedEventArgs e)
        {
            GetHome();
        }
        private void btnHome_Click(object sender, RoutedEventArgs e)
        {
            Files.Clear();
            GetHome();
            var array = BreadCrumbBars.ToList();
            array.RemoveRange(0, BreadCrumbBars.Count - 0);
            BreadCrumbBars = new ObservableCollection<FolderItem>(array);
        }
        private void Hyperlink_Click(object sender, RoutedEventArgs e)
        {
            var hyperlink = (Hyperlink)sender;
            if (hyperlink == null) return;
            var model = (FolderItem)hyperlink.DataContext;
            if (model == null) return;
            LinkFolder(model);
        }

       
        private void FilesListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if (FilesSelectedItem == null) return;
            BreadCrumbBars.Add(FilesSelectedItem);
            AddFolder(FilesSelectedItem);
            
        }
        private void LinkFolder(FolderItem folderItem)
        {
            var index = BreadCrumbBars.IndexOf(folderItem);
            if (index < BreadCrumbBars.Count)
            {
                var array = BreadCrumbBars.ToList();
                if(index == 0)
                {
                    index += 1;
                    array.RemoveRange(index, BreadCrumbBars.Count - index);

                }
                else
                    array.RemoveRange(index, BreadCrumbBars.Count - index);
                BreadCrumbBars = new ObservableCollection<FolderItem>(array);
            }
            AddFolder(folderItem);
        }

        void AddFolder(FolderItem folderItem)
        {
            try
            {
                if (folderItem == null) return;
                FilesListView.SelectedIndex = -1;
                FilesListView.SelectedItem = null;
                Files.Clear();
                var list = new ObservableCollection<FolderItem>();
                if (File.Exists(folderItem.FullName)) return;
                var directory = new DirectoryInfo(folderItem.FullName + @"\");
                if (directory.GetDirectories() == null) return;
                foreach (var item in directory.GetDirectories())
                {
                    var fileInfo = new FolderItem() { Name = item.Name, FullName = item.FullName };
                    if (list.Contains(fileInfo)) continue;
                    Files.Add(fileInfo);
                }
                foreach (var item in directory.GetFiles())
                {
                    var fileInfo = new FolderItem() { Name = item.Name, FullName = item.FullName };
                    if (list.Contains(fileInfo)) continue;
                    Files.Add(fileInfo);
                }
            }
            catch (Exception)
            {

                throw;
            }
        }

        void GetHome()
        {
            DriveInfo[] allDrives = DriveInfo.GetDrives();
            foreach (DriveInfo drive in allDrives)
            {
                if (drive.IsReady == true)
                {
                    var fileInfo = new FolderItem() { Name = drive.Name, FullName = drive.Name };
                    Files.Add(fileInfo);
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged([CallerMemberName] string propertyName = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
      
    }
    public class FolderItem
    {
        public string Name { get; set; }
        public string FullName { get; set; } = string.Empty;
    }

}

到此这篇关于基于WPF实现面包屑效果的示例代码的文章就介绍到这了,更多相关WPF面包屑内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

基于WPF实现面包屑效果的示例代码

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

基于WPF实现面包屑效果的示例代码

这篇文章主要为大家详细介绍了如何基于WPF实现面包屑效果,文中的示例代码讲解详细,对我们学习或工作有一定帮助,感兴趣的小伙伴可以了解一下
2023-05-17

基于WPF实现3D画廊动画效果的示例代码

这篇文章主要为大家详细介绍了如何基于WPF实现简单的3D画廊动画效果,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
2023-02-28

基于WPF实现步骤控件的示例代码

这篇文章主要为大家详细介绍了WPF实现简单的步骤控件,文中的示例代码讲解详细,对我们学习或工作有一定帮助,感兴趣的小伙伴可以了解一下
2023-01-11

基于WPF实现蒙板控件的示例代码

这篇文章主要为大家详细介绍了WPF实现蒙板控件,文中的示例代码讲解详细,对我们学习或工作有一定帮助,感兴趣的小伙伴可以了解一下
2023-03-09

WPF实现抽屉菜单效果的示例代码

这篇文章主要介绍了如何利用WPF实现抽屉菜单效果,文中的示例代码讲解详细,对我们学习或工作有一定帮助,需要的可以参考一下
2022-11-13

基于WPF实现多选下拉控件的示例代码

这篇文章主要为大家详细介绍了WPF实现简单的多选下拉控件,文中的示例代码讲解详细,对我们学习或工作有一定帮助,感兴趣的小伙伴可以了解一下
2023-02-01

WPF实现页面的切换的示例代码

本文主要介绍了WPF实现页面的切换的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
2023-01-30

WPF实现基础控件之托盘的示例代码

这篇文章主要为大家详细介绍了如何利用WPF实现托盘这一基础控件,文中的示例代码讲解详细,对我们学习或工作有一定帮助,感兴趣的小伙伴可以了解一下
2022-11-13

编程热搜

  • Python 学习之路 - Python
    一、安装Python34Windows在Python官网(https://www.python.org/downloads/)下载安装包并安装。Python的默认安装路径是:C:\Python34配置环境变量:【右键计算机】--》【属性】-
    Python 学习之路 - Python
  • chatgpt的中文全称是什么
    chatgpt的中文全称是生成型预训练变换模型。ChatGPT是什么ChatGPT是美国人工智能研究实验室OpenAI开发的一种全新聊天机器人模型,它能够通过学习和理解人类的语言来进行对话,还能根据聊天的上下文进行互动,并协助人类完成一系列
    chatgpt的中文全称是什么
  • C/C++中extern函数使用详解
  • C/C++可变参数的使用
    可变参数的使用方法远远不止以下几种,不过在C,C++中使用可变参数时要小心,在使用printf()等函数时传入的参数个数一定不能比前面的格式化字符串中的’%’符号个数少,否则会产生访问越界,运气不好的话还会导致程序崩溃
    C/C++可变参数的使用
  • css样式文件该放在哪里
  • php中数组下标必须是连续的吗
  • Python 3 教程
    Python 3 教程 Python 的 3.0 版本,常被称为 Python 3000,或简称 Py3k。相对于 Python 的早期版本,这是一个较大的升级。为了不带入过多的累赘,Python 3.0 在设计的时候没有考虑向下兼容。 Python
    Python 3 教程
  • Python pip包管理
    一、前言    在Python中, 安装第三方模块是通过 setuptools 这个工具完成的。 Python有两个封装了 setuptools的包管理工具: easy_install  和  pip , 目前官方推荐使用 pip。    
    Python pip包管理
  • ubuntu如何重新编译内核
  • 改善Java代码之慎用java动态编译

目录