2019-1-27-WPF-使用-ItemsPanel-修改方向

最新推荐文章于 2024-04-05 20:23:35 发布
最新推荐文章于 2024-04-05 20:23:35 发布
阅读量587 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lindexi_gd/article/details/103184542
版权
titleauthordateCreateTimecategories
WPF 使用 ItemsPanel 修改方向
lindexi
2019-1-27 21:8:9 +0800
2019-01-11 19:53:56 +0800
WPF

在 WPF 很多时候都需要使用 ListView 但是默认的列表是垂直的，如果需要使用水平的，就需要使用 ItemsPanel 设置使用的类

先添加一些代码到资源，下面就可以使用这里的资源

      <Grid.Resources>
            <XmlDataProvider x:Key="InventoryData" XPath="Books">
                <x:XData>
                    <Books xmlns="">
                        <Book ISBN="0-7356-0562-9" Stock="in" Number="9">
                            <Title>XML in Action</Title>
                            <Summary>XML Web Technology</Summary>
                        </Book>
                        <Book ISBN="0-7356-1370-2" Stock="in" Number="8">
                            <Title>Programming Microsoft Windows With C#</Title>
                            <Summary>C# Programming using the .NET Framework</Summary>
                        </Book>
                        <Book ISBN="0-7356-1288-9" Stock="out" Number="7">
                            <Title>Inside C#</Title>
                            <Summary>C# Language Programming</Summary>
                        </Book>
                        <Book ISBN="0-7356-1377-X" Stock="in" Number="5">
                            <Title>Introducing Microsoft .NET</Title>
                            <Summary>Overview of .NET Technology</Summary>
                        </Book>
                        <Book ISBN="0-7356-1448-2" Stock="out" Number="4">
                            <Title>Microsoft C# Language Specifications</Title>
                            <Summary>The C# language definition</Summary>
                        </Book>
                    </Books>
                </x:XData>
            </XmlDataProvider>
        </Grid.Resources>

添加一个 ListView 然后通过 ItemTemplate 设置界面

       <ListView ItemsSource="{Binding Source={StaticResource InventoryData}, XPath=Book}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid Background="#5a5a5a" Margin="10,10,10,10">
                        <StackPanel Margin="2,2,2,2">
                            <TextBlock Text="{Binding XPath=Title}" />
                            <TextBlock Text="{Binding XPath=@ISBN}" />
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

这里的 DataTemplate 传入的 DataContext 就是 ItemsSource 绑定的列表的每一项

如绑定了 List 那么这里的 DataContext 就是 Foo 类

于是在这里就可以通过绑定 DataContext 的属性绑定界面

上面代码运行可以看到列表是垂直的

如果需要修改为水平的，可以通过 ItemsPanel 修改

            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>

代码全部都在 xaml 写，因为神树说在后台写不好

    <Grid>
        <Grid.Resources>
            <XmlDataProvider x:Key="InventoryData" XPath="Books">
                <x:XData>
                    <Books xmlns="">
                        <Book ISBN="0-7356-0562-9" Stock="in" Number="9">
                            <Title>XML in Action</Title>
                            <Summary>XML Web Technology</Summary>
                        </Book>
                        <Book ISBN="0-7356-1370-2" Stock="in" Number="8">
                            <Title>Programming Microsoft Windows With C#</Title>
                            <Summary>C# Programming using the .NET Framework</Summary>
                        </Book>
                        <Book ISBN="0-7356-1288-9" Stock="out" Number="7">
                            <Title>Inside C#</Title>
                            <Summary>C# Language Programming</Summary>
                        </Book>
                        <Book ISBN="0-7356-1377-X" Stock="in" Number="5">
                            <Title>Introducing Microsoft .NET</Title>
                            <Summary>Overview of .NET Technology</Summary>
                        </Book>
                        <Book ISBN="0-7356-1448-2" Stock="out" Number="4">
                            <Title>Microsoft C# Language Specifications</Title>
                            <Summary>The C# language definition</Summary>
                        </Book>
                    </Books>
                </x:XData>
            </XmlDataProvider>
        </Grid.Resources>

        <ListView ItemsSource="{Binding Source={StaticResource InventoryData}, XPath=Book}">
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>

            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid Background="#5a5a5a" Margin="10,10,10,10">
                        <StackPanel Margin="2,2,2,2">
                            <TextBlock Text="{Binding XPath=Title}" />
                            <TextBlock Text="{Binding XPath=@ISBN}" />
                        </StackPanel>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>

代码 https://gitee.com/lindexi/lindexi_gd/blob/68cefabd097bf2f4fc35e3384f34e1dc622a67ad/PotrallTiscawMouger/PotrallTiscawMouger/MainWindow.xaml

lindexi_gd
关注
WPF的ItemsPanelTemplate（容器模板 ）
qq_30725967的博客
09-02 1240
ItemsPanelTemplate在MSDN的解释是：ItemsPanelTemplate 指定用于项的布局的面板。类型具有一个类型为ItemsPanelTemplate 的。具有一个类型为 ItemsPanelTemplate 的。
【愚公系列】2023年10月 WPF+上位机+工业互联 002-WPF布局控件
热门推荐
时光隧道
09-07 4万+
WPF布局是指在Windows Presentation Foundation（WPF）中定义和管理用户界面元素的方式。WPF提供了不同类型的布局容器，如Grid、StackPanel、WrapPanel和DockPanel等，使得开发人员能够轻松地创建灵活和可扩展的用户界面。WPF布局可通过XAML标记语言或代码实现。它提供了一种分离界面和逻辑的方式，使得开发人员能够更容易地管理用户界面的外观和行为。控件功能Canvas。
WPF ItemsPanelTemplate
L.的博客
12-11 1168
用以定义集合控件的容器外观，如ListBox,Combox 等等 使用一个自定义的ListBox用以说明，其默认外观是上下排列，这里修改成横向排列 <Window.Resources> <DataTemplate x:Key="PersonDataTemplate"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="*"
WPF使用ItemsControl自定义ItemPanel
pw8992134的博客
04-09 428
TextBlock</Border></Grid>设置IsItemsHost="True"即可使用绑定，此代码相当于制定了ItemPanel为local:DisplayScreenGrid。
#400 – 使用ItemsPanel 属性将WrapPanel 作为ListBox的显示面板（Using a WrapPanel as the Items Panel for a ListBox）
Milo的专栏
11-09 4227
ListBox 的ItemsPanel 属性可以指定定义显示各子项的面板的模板。你可以通过定义自己的模板重写ListBox 常见的垂直堆叠式布局。 如果你设置了ItemsPanel 模板为WrapPanel，ListBox 将会有WrapPanel的特性。 在下面的例子中，我们将上一篇中的ListBox 稍作修改。指定ItemsPanel 包含一个WrapPanel。
Avalonia跨平台入门第二十三篇之滚动字幕
dotNET跨平台
03-20 434
在前面分享的几篇中咱已经玩耍了Popup、ListBox多选、Grid动态分、RadioButton模板、控件的拖放效果、控件的置顶和置底、控件的锁定、自定义Window样式、动画效果、E...
【愚公系列】2023年10月 WPF+上位机+工业互联 003-扩展布局控件
时光隧道
09-07 4万+
WPF布局是指在Windows Presentation Foundation（WPF）中定义和管理用户界面元素的方式。WPF提供了不同类型的布局容器，如Grid、StackPanel、WrapPanel和DockPanel等，使得开发人员能够轻松地创建灵活和可扩展的用户界面。WPF布局可通过XAML标记语言或代码实现。它提供了一种分离界面和逻辑的方式，使得开发人员能够更容易地管理用户界面的外观和行为。控件功能Canvas。
WPF--控件（代码讲解）
w_g_y123456的博客
12-22 1762
粗略而言，使用最多控件的基本为6类，即： （1）布局控件：可以容纳多个控件或嵌套其他布局控件。有Grid、StackPanel、DockPanel等。他们拥有共同的父类Panel。 Panel族控件包含： StackPanel、UniformGrid、WraPanel……； 内容属性为Children。 （2）内容控件：只能一个其他控件或布局控件作为他的内容。有Window、Button等。他们的父类为ContentControl。 ContentControl族控件包含： Button、Label、
WPF 数据.pdf
02-03
</HierarchicalDataTemplate.ItemsPanel> ``` #### 22. 对分层XML数据使用主-从模式 - **定义**: 对分层XML数据使用主-从模式。 - **实现方式**: - 使用`XmlDataProvider`结合`XPath`查询。 - ...
WPF高级使用
独行者
03-28 584
WPF 中，有两个与焦点有关的主要概念：键盘焦点和逻辑焦点。 键盘焦点指接收键盘输入的元素，而逻辑焦点指焦点范围中具有焦点的元素。 本概述将详细介绍这些概念。 理解这些概念之间的区别对于创建具有可以获取焦点的多个区域的复杂应用程序是非常重要的。 参与焦点管理的主要类有Keyboard类、FocusManager类以及基元素类（如UIElement和ContentElement）。 有关基元素的更多信息，请参见基元素概述。 Keyboard类主要与键盘焦点相关，而FocusManager...
WPF -- 控件模板 （ItemsPanelTemplate）（二）
qq_23018459的博客
04-11 4172
前面介绍了控件模板的应用和Style的差异，并以ControlTemplate举例，接下来举一个ItemsPanelTemplate的例子：比如我现在要写一个自定义MessageBox自定义控件，当不同的message类型时会显示不同的样式，其中MessageBox下面的操作按钮群显示的按钮也不一样。。。。 switch (button) { ...
c# wpf template ItemsPanel 简单试验
最新发布
xie__jin__cheng的博客
04-05 402
c# wpf template ItemsPanel 简单试验
WPF——为ListBox的Items设置布局面板
Zeeno的学习博客
08-12 1838
自定义 ListBox 的控件面板 在默认情况下，ListBox 的子项目显示类似于默认的 StackPanel，在水平方向为 Strench 垂直方向进行堆叠. 而有时候，为了控制子元素的布局方式，需要自定义 ListBox 的内部面板，例如为了实现下面的效果 可以看到，上面采用的是双列布局，实际上用的是 UniformGrid 控件作为 ListBox 的内部面板，因此，对于绑定的数据集合，就相当于是在一个 UniformGrid 中进行放置，唯一区别的是，每个子元素的范围是其实际的占用区域，在其外部
WPF 自定义ItemsControl/ListBox/ListView控件样式
u014453443的博客
05-08 2450
扣扣技术交流群：460189483 一、前言 ItemsControl、ListBox、ListView这三种控件在WPF中都可作为列表信息展示控件。我们可以通过修改这三个控件的样式来展示我们的列表信息。 既然都是展示列表信息的控件，那他们有什么相同点和不同点呢。 同： 　　1、这三个控件都是列表型控件，可以进行列表绑定（ItemsSource）； 　　2、这三个控件均使用Items...
wpf ItemsPanelTemplate实现横向排列
dxm809的博客
08-02 575
<Window x:Class="WpfApp03.TestWin11" 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" x.
WPF Template,ItemsTemplate,ItemContainerStyle,ItemsPanel,ContentPresenter
weixin_53370274的博客
03-27 581
我现在有个需求，要求做个像360右上角的配置菜单的按钮， 用Botton和popup可以实现，可我不想写太多事件，这时候我想到了comboBox这个控件，点击出现下拉的内容，真是太符合我的需要了，于是，我就决定定制ComboBox。首先，默认的ComboBox是一个两行两列的布局，(0,0)（第一行，第一列的位置）位置处是一个编辑控件，(0,1)是个按钮，(1,0)(1,1)是个popup，就是点击出现下拉的位置，popup的显示绑定按钮的状态，于是，我们点击按钮的时候，popup就显示出来，popup区
WPF Template，ItemsPresenter，ItemContainerStyle，ItemsPanel，contentpresenter
织梦行云
05-06 1万+
刚开始接触WPF中，这几个概念常常让人迷惑，
WPF控件-ItemsControl介绍和用法
海盗Sharp的博客
02-05 4584
ItemsControl是用于展示一组项的控件。我们常见的列表（ListBox）、数据表格（DataGrid）等都是继承自ItemsControl。可用于自定义样式展示各种批量的数据集合。设置ItemsPanel布局控件为StackPanel,如果需要横向布局，则设置StackPanel的.设置里面为自己想展示的内容样式，并绑定对应的数据。通过绑定坐标来实现自定义控件按照一定的布局进行摆放，可以用于开发一些组态软件，设备布局图等。
【wpf】实战 ItemsControl + 用户控件 + 绑定
songhuangong123的博客
08-13 5558
这次是对之前学习的内容的一次实战内容，背景如下，我写了一个串口控件（用户控件）界面上需要支持多个串口，每个串口的都有配置项，配置项需要保存到本地。 首先准备一个ItemsControl，每个子项装一个串口控件。然后，构建数据结构，每个串口对应一个SeriaInfo，然后再构建一个SeriaInfo的数组，作为数据源。由于我不想横向摆放控件，所以需要修改ItemsControl的ItemsPanel。............
wpf listview 横向布局
09-21
### 回答1： 你可以使用WPF ListView的ItemsPanel属性来指定ListView项的布局方式。以下是一种实现横向布局的方法： 1. 在XAML中定义ListView，并将ItemsPanel属性设置为StackPanel： ``` <ListView ItemsSource="{Binding Items}"> <ListView.ItemsPanel> <ItemsPanelTemplate> <StackPanel Orientation="Horizontal" /> </ItemsPanelTemplate> </ListView.ItemsPanel> <ListView.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding}" /> </DataTemplate> </ListView.ItemTemplate> </ListView> ``` 2. 将StackPanel的Orientation属性设置为Horizontal。 这样，ListView的项将以横向布局方式呈现。你可以根据需要调整其它属性，例如间距、对齐方式等。 ### 回答2： WPF（Windows Presentation Foundation）是微软公司推出的用于创建Windows应用程序的框架。ListView是WPF中常用的控件之一，用于显示一组数据项的列表。默认情况下，ListView的布局是纵向的，即数据项按垂直方向排列。如果需要实现ListView的横向布局，可以通过以下几个步骤来实现。 首先，在XAML文件中声明一个ListView控件，并设置其Orientation属性为Horizontal，这将使ListView变为横向布局。 ```csharp <ListView Width="500" Height="200" Orientation="Horizontal"> <!-- 在此处添加数据模板和数据绑定 --> </ListView> ``` 接下来，需要为ListView指定数据模板和数据绑定，以展示列表中的数据项。 ```csharp <ListView Width="500" Height="200" Orientation="Horizontal"> <ListView.ItemTemplate> <DataTemplate> <!-- 在此处定义数据项的布局和样式 --> </DataTemplate> </ListView.ItemTemplate> </ListView> ``` 在DataTemplate中可以定义数据项的布局和样式，例如可以使用StackPanel来水平排列数据项的内容。 ```csharp <ListView Width="500" Height="200" Orientation="Horizontal"> <ListView.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <!-- 在此处添加数据项的内容 --> </StackPanel> </DataTemplate> </ListView.ItemTemplate> </ListView> ``` 最后，在代码中通过数据绑定将数据项与ListView关联起来，以实现数据的显示和更新。 综上所述，通过设置ListView的Orientation属性为Horizontal，并在DataTemplate中使用StackPanel来横向布局数据项的内容，再通过数据绑定将数据与ListView关联，即可实现WPF中ListView的横向布局。 ### 回答3： WPF中的ListView控件默认的布局方式是纵向布局，即列表项垂直排列。如果想要实现ListView的横向布局，可以通过修改ItemPanel的布局方式来实现。 首先，我们需要把ListView的ItemsPanel修改为一个横向布局的面板，比如使用WrapPanel或者UniformGrid。通过修改ListView的ItemPanel属性，可以将默认的ItemsPanel修改为横向布局的面板，如下所示： ``` <ListView> <ListView.ItemsPanel> <ItemsPanelTemplate> <WrapPanel Orientation="Horizontal"/> </ItemsPanelTemplate> </ListView.ItemsPanel> <!--其他代码--> </ListView> ``` 这样，ListView中的列表项就会横向排列了。但是需要注意的是，如果内容过多，会导致横向排列的列表项超出窗口范围，因此还需要根据实际情况设置ListView的宽度或者调整WrapPanel的宽度来适应布局。 另外，还可以通过修改ListView的ItemContainerStyle来定制列表项的样式，使其适应横向布局。比如设置列表项的最小宽度、高度、边距等，以及设置水平对齐方式等。 总之，通过修改ListView的ItemsPanel和ItemContainerStyle，可以实现ListView的横向布局，使列表项横向排列。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值