【WPF】设置ListBox容器子控件的布局

最新推荐文章于 2024-04-21 20:39:39 发布
最新推荐文章于 2024-04-21 20:39:39 发布
阅读量5.2k 收藏 1
点赞数 1
分类专栏： WPF 文章标签： wpf

需求：像下图那样显示把一组内容装入ListBox中显示。要求用WrapPanel横向布局，顺序如图中的数字。

这里写图片描述

问题：ListBox默认的布局是从上往下单列的，所以需要设置布局。

<ListBox x:Name="HousePlansLB">
    <ListBox.Template>
        <ControlTemplate TargetType="ListBox">
            <WrapPanel Width="600" Orientation="Horizontal" IsItemsHost="True"/>
        </ControlTemplate>
    </ListBox.Template>

    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
    <TextBox Text="测试" Width="140" Height="90" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
</ListBox>

实际使用中，还要给ListBox设置它的ItemsSource绑定到ViewModel中的某个列表，不会是向上面那样直接手打一串的TextBox的。

重要的参考：

http://www.cnblogs.com/qishichang/archive/2010/09/30/1839040.html

霍莉雪特
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
WPF的ListView控件自定义布局用法实例
09-02
主要介绍了WPF的ListView控件自定义布局的方法,结合实例形式分析了WPF中ListView控件的布局方法,需要的朋友可以参考下
WPF中ListBox的创建和多种绑定用法
weixin_34082789的博客
02-17 908
本篇博文为翻译（http://www.c-sharpcorner.com/uploadfile/mahesh/listbox-in-wpf/），本篇博文主要介绍ListBox控件的创建和用法。<ListBox></ListBox>先从最容易的开始演示ListBox控件的创建。 Adding ListBox Items下面的代码是向ListBox控件中添加多项ListBox...
WPF —— ListBox控件、GroupBox控件详解
lu2023_8_6的博客
03-18 594
ListBox 是一个 ItemsControl，这意味着它可以包含任何类型的对象的集合 (，例如字符串、图像或面板)。一个 ListBox 中的多个项是可见的，与仅 ComboBox具有所选项可见的项不同，除非 IsDropDownOpen 属性为 true。该 SelectionMode 属性确定一次是否可以选择多个项 ListBox。
WPF 动态添加控件（单选框）ListView、ListBox、ItemsControl
SJ15630070060的博客
10-27 2030
以三个控件并没有做深度的研究，只是简单做了个效果展示，如果单独给以上某个控件设置属性或样式应该也是可以进行更改的。ItemsControl，是我最终使用的方式，并且ItemsControl默认是不带滚动条的，需要单独添加。LIstBox在遍历出的控件高度会根据所添加的控件最高高度相对应的，导致留有很多空白区域。需求：根据衣物类型做数据的过滤条件，布局方式要求侧边垂直显示。这次讲解主要是围绕个人的实际情况去简单做的效果分析和展示。相对比方ListBox他的高度是自适应的。方法二：ListBox。
WPF-常见集合控件（ItemsControl、ListView、DataGrid、TreeView、TabControl.......）
rwo_bear的博客
09-03 1696
属于ItemsControl族主要用到两个依赖属性：ItemSource:指定数据来源ItemTemplete:在资源中指定一个数据显示模板更多属性：DisplayMemberPath、SelectedValuePath。。。
VBA中listbox控件额阐述
qq_22836667的博客
09-01 1163
通过ListBox控件，您可以使用户选择一个或多个项目，并且可以根据他们的选择执行其他相应的操作，这使ListBox成为许多VBA用户界面中不可或缺的控件之一。ListBox控件是VBA中经常使用的控件之一。它用于在用户界面上显示一系列项目，用户可以通过选择列表中的项目来执行相关操作。在VBA界面中打开用户窗体，或者在Excel中打开Visual Basic编辑器，添加一个UserForm窗体。在VBA中定义ListBox所需的变量。在窗体上添加一个ListBox控件。
C#中listBox1控件详细使用方法
xiaogongzhu001的博客
06-07 3354
C#中listBox1控件详细使用方法
WPF 控件专题 ListBox 控件详解
^@^lemon tea^@^
09-14 9673
WPF 控件专题 ListBox 控件详解
wpf ListView数据居中
qq_44858151的博客
03-01 922
1.ListView数据居中 <ListView.ItemContainerStyle> <Style TargetType="{x:Type ListViewItem}"> <Setter Property="HorizontalContentAlignment" Value="Center" /> </Style> </ListView.ItemContainerStyle> 2.界面
ListBox控件
weixin_44570549的博客
08-15 1957
ListBox控件 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 开发工具与关键技术：Visual Studio 2015 作者：李成富 撰写时间：2019年8月12日 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ListBox控件又称列表框，它在工具箱中的图标为，它显示一个项目列表供用户选择。列表框（ListBox）控件...
WPF中的ListBox实现按块显示元素的方法
09-01
主要介绍了WPF中的ListBox实现按块显示元素的方法,涉及ListBox属性设置相关操作技巧,需要的朋友可以参考下
listbox控件介绍
05-03
listbox控件介绍
WPF控件动态添加子控件
03-26
WPF控件动态添加子控件
wpf 查找父控件、子控件
03-07
可寻找指定对象的所有子集或父集对象
WPF 带有checkbox的ListBox控件
09-02
WPF 带有checkbox的ListBox控件,支持绑定！
C#WPF通过串口(232协议)调用基恩士打标机进行打标
weixin_50236846的博客
04-19 172
创作背景：突然想起来去年做了一个关于调用基恩士打标机的项目，据我的了解，大多数客户与基恩士设备的通讯都是TCP/IP模式，但是我们这个项目的甲方特意要求使用串口模式进行通讯，二者的指令都是一样的。下面将这个项目的关键处理点分享给大家。 想要精准控制一个设备，我们首先要了解设备的工作原理，以及控制顺序等信息。这里原理就不做过多介绍(因为我也不懂😂)。
界面组件Telerik UI for WPF 2024 Q1新版亮点 - 全新DateRangePicker组件
需要界面开发、IDE工具研发中文教程资料的小伙伴，记得私信我~
04-18 846
本文将介绍界面组件Telerik UI for WPF在今年第一个重大版本2024 Q1中发布的新功能，欢迎下载最新版组件体验！
Wpf 使用 Prism 实战开发Day21
最新发布
码侬人生
04-21 369
// 配置默认显示页接口。
WPF 设置listbox滚动条
04-05
1. 在XAML中，可以使用ScrollBarStyle属性来设置ListBox的滚动条样式。 2. 可以使用Style属性为ListBox的滚动条定义一个样式。例如，以下是一个简单的样式，它将滚动条的背景颜色设置为灰色： ```xaml <ListBox ScrollViewer.VerticalScrollBarStyle="{StaticResource ScrollBarStyle}"> <ListBox.Resources> <Style TargetType="ScrollBar" x:Key="ScrollBarStyle"> <Setter Property="Background" Value="Gray"/> </Style> </ListBox.Resources> </ListBox> ``` 3. 可以使用VisualStateManager类来定义滚动条的不同状态，例如：正常、拖动、禁用等等。以下是一个示例，其中定义了三种状态： ```xaml <ListBox ScrollViewer.VerticalScrollBarStyle="{StaticResource ScrollBarStyle}"> <ListBox.Resources> <Style TargetType="ScrollBar" x:Key="ScrollBarStyle"> <Setter Property="Background" Value="Gray"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ScrollBar"> <Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimation Storyboard.TargetName="PART_Thumb" Storyboard.TargetProperty="Opacity" To="0.5" Duration="0"/> </Storyboard> </VisualState> <VisualState x:Name="MouseOver"> <Storyboard> <DoubleAnimation Storyboard.TargetName="PART_Thumb" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Border Grid.Row="0" Background="{TemplateBinding Background}" CornerRadius="2"/> <RepeatButton Grid.Row="0" Style="{StaticResource ScrollBarButtonStyle}" Command="{TemplateBinding Track.DecreaseCommand}" IsEnabled="{TemplateBinding Track.DecreaseButton.IsEnabled}"/> <Track Grid.Row="0" Name="PART_Track"> <Track.DecreaseRepeatButton> <RepeatButton Style="{StaticResource ScrollBarButtonStyle}" Command="{TemplateBinding Track.DecreaseCommand}" IsEnabled="{TemplateBinding Track.DecreaseButton.IsEnabled}"/> </Track.DecreaseRepeatButton> <Track.Thumb> <Thumb x:Name="PART_Thumb" Style="{StaticResource ScrollBarThumbStyle}"/> </Track.Thumb> <Track.IncreaseRepeatButton> <RepeatButton Style="{StaticResource ScrollBarButtonStyle}" Command="{TemplateBinding Track.IncreaseCommand}" IsEnabled="{TemplateBinding Track.IncreaseButton.IsEnabled}"/> </Track.IncreaseRepeatButton> </Track> <RepeatButton Grid.Row="1" Style="{StaticResource ScrollBarButtonStyle}" Command="{TemplateBinding Track.IncreaseCommand}" IsEnabled="{TemplateBinding Track.IncreaseButton.IsEnabled}"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style TargetType="Thumb" x:Key="ScrollBarThumbStyle"> <Setter Property="Background" Value="#FF8E8F8F"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="BorderBrush" Value="#FFCED2D8"/> <Setter Property="Width" Value="8"/> <Setter Property="Height" Value="20"/> <Setter Property="IsTabStop" Value="False"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Thumb"> <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style TargetType="RepeatButton" x:Key="ScrollBarButtonStyle"> <Setter Property="Background" Value="Transparent"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="BorderBrush" Value="#FFCED2D8"/> <Setter Property="Width" Value="10"/> <Setter Property="Height" Value="10"/> <Setter Property="IsTabStop" Value="False"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"/> </ControlTemplate> </Setter.Value> </Setter> </Style> </ListBox.Resources> </ListBox> ``` 4. 可以使用ScrollViewer类来设置ListBox的滚动行为。例如，以下是一个示例，它启用了水平滚动条和垂直滚动条： ```xaml <ListBox ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Auto"> </ListBox> ``` 5. 可以使用ScrollBar类的各种属性和事件来自定义ListBox的滚动条。例如，以下是一个示例，它定义了一个自定义滚动条，该滚动条使用Thumb.DragStarted事件和Thumb.DragDelta事件来更新ListBox的滚动位置： ```xaml <ListBox> <ListBox.Resources> <Style TargetType="ScrollBar"> <Setter Property="Background" Value="Gray"/> <Setter Property="Width" Value="10"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ScrollBar"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Border Grid.Row="0" Background="{TemplateBinding Background}" CornerRadius="2"/> <Thumb x:Name="PART_Thumb" Background="#FF8E8F8F" BorderThickness="1" BorderBrush="#FFCED2D8" Width="8" Height="20" IsTabStop="False" DragStarted="PART_Thumb_DragStarted" DragDelta="PART_Thumb_DragDelta"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </ListBox.Resources> </ListBox> ``` ```csharp private void PART_Thumb_DragStarted(object sender, DragStartedEventArgs e) { var thumb = sender as Thumb; var scrollBar = thumb.TemplatedParent as ScrollBar; if (scrollBar != null) { scrollBar.CaptureMouse(); } } private void PART_Thumb_DragDelta(object sender, DragDeltaEventArgs e) { var thumb = sender as Thumb; var scrollBar = thumb.TemplatedParent as ScrollBar; if (scrollBar != null) { double newValue = scrollBar.Value - e.VerticalChange; if (newValue < scrollBar.Minimum) { newValue = scrollBar.Minimum; } else if (newValue > scrollBar.Maximum) { newValue = scrollBar.Maximum; } scrollBar.Value = newValue; } } ``` 以上是一些设置WPF ListBox滚动条的方法。可以根据需要进行自定义和修改，以满足具体的需求。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值