wpf ListBox,item两列不等高。
业务有这样的需求,类似瀑布流。内容两列不等高展示。
只需要继承panel,重写MeasureOverride和ArrangeOverride方法就行了。
很简单,内容都在代码里。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls; namespace XXXXXX
{
public class TwoColumnPanel : Panel
{
/// <summary>
/// 先测量需要多大尺寸,做个申报准备
/// </summary>
/// <param name="constraint">限定的尺寸,比如,规定了width和height</param>
/// <returns></returns>
protected override Size MeasureOverride(Size constraint)
{
//定义预期的宽度和高度
double height = 0, height1 = 0, height2 = 0, width = 0;
UIElement element;
if (Children.Count > 0)
{
element = Children[0];
width = element.DesiredSize.Width*2;
}
//遍历每个元素,计算所需的总尺寸
for (int i = 0; i < Children.Count; i++)
{
element = Children[i];
//按照限定的尺寸测量一下自己,拿镜子找着自己
element.Measure(constraint);
if (i % 2 == 0)
{
height1 += element.DesiredSize.Height;
}
else
{
height2 += element.DesiredSize.Height;
}
}
height = height1 > height2 ? height1 : height2; //申报,我需要这个尺寸
return new Size(width, height);
} /// <summary>
/// 排列每个元素
/// </summary>
/// <param name="arrangeBounds">测量的尺寸</param>
/// <returns></returns>
protected override Size ArrangeOverride(Size arrangeBounds)
{
double currentX2 = 0,currentY1 = 0,currentY2 = 0;
UIElement element; if (Children.Count > 0)
{
element = Children[0];
currentX2 = element.DesiredSize.Width;
} for (int i = 0; i < Children.Count; i++)
{
element = Children[i];
//排列每个元素
if (i % 2 == 0)
{
Children[i].Arrange(new Rect(0, currentY1, element.DesiredSize.Width, element.DesiredSize.Height));
currentY1 += element.DesiredSize.Height;
}
else
{
Children[i].Arrange(new Rect(currentX2, currentY2, element.DesiredSize.Width, element.DesiredSize.Height));
currentY2 += element.DesiredSize.Height;
} }
return arrangeBounds;
}
}
}
wpf ListBox,item两列不等高。的更多相关文章
- 多种方法实现div两列等高(收集整理)
HTML骨架 <div id="header">头部</div> <div id ="container"> <div ...
- JQuery 实现两列等高并自适应高度
想要使用 JQuery 实现两列等高并自适应高度,其实也很简单,原理就是取得左右两边的高度,然后判断这个值,把大的值赋给小的就行了.看代码: $(document).ready(function() ...
- 两列等高布局 padding+margin的负值 CSS布局奇淫技巧之-多列等高
代码: 效果图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/ ...
- 纯css实现两列等高
<!doctype html> <html> <head> <meta /> <title>Title</title> < ...
- css两列等高布局
布局方案 等高布局有几种不同的方法,但目前为止我认为浏览器兼容最好最简便的应该是padding补偿法.首先把列的padding-bottom设为一个足够大的值,再把列的margin-bottom设一个 ...
- 利用jQuery进行三行两列等高布局
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 布局两列div等高方法
一.左右布局,左侧div绝对定位,外div相对定位 <!DOCTYPE html> <html lang="en"> <head> <me ...
- 两列布局,读《css那些事儿》
两列布局: 1.两列定宽: 要点:float.width固定. :after清除浮动. 前提:两列的盒模型宽度相加不能大于父元素的宽度,否则会出现错位现象. <!DOCTYPE html> ...
- flex 垂直居中、两列对齐、自适应宽
flex 垂直居中 <div id="parent"> <div id="child"> </div> </div&g ...
随机推荐
- Hibernate单向多对一对象关系模型映射
单向的many-to-one 案例: 班级和学生 父亲和子女 单向:只能由其中一方维护关系 Many-to-one中有many的一方法维护或者体现两者之间的关系. 单向的many-to-one描述学生 ...
- Linux Shell多命令执行
有三种: :只是顺序执行,命令之间没有任何关联,不相互影响.如 ls;date;cd /etc/ 如,创建100M的文件. && 命令之间有关系,只有前一条命令正确执行才会执行下面一 ...
- microsofr visual studio编写c语言
过程: 1.创建win32 控制台项目 文件->新建->项目->Visual C++ ->Win32 输入项目名称 选择项目保存位置 2.添加->新建如图
- IOS开发之实现App消息推送
转自:http://blog.csdn.net/shenjie12345678/article/details/41120637 第一部分 首先第一步当然是介绍一下苹果的推送机制(APNS)咯(ps: ...
- postgresql集群方案参考答案
PostgreSQL配置Streaming Replication集群 http://www.cnblogs.com/marsprj/archive/2013/03/04/2943373.html p ...
- vsftp详细配置(转)
详细配置转载来自以下链接: http://yuanbin.blog.51cto.com/363003/108262 vsftp源码下载(vsftpd-3.0.2.tar.gz): http://dow ...
- Android - 控件android:ems属性
Android - 控件android:ems属性http://blog.csdn.net/caroline_wendy/article/details/41684255?utm_source=tui ...
- Windows 10 周年更新正式版下载 + win10 快捷键
Windows 10 周年更新正式版 360云资源总汇(施工中): https://yunpan.cn/c6Svi7Az52XBs (提取码:e5dd)今后提到周年更新版.1607版或RS1版,都是 ...
- ODATA WEB API(一)---扩展使用
一.概述 时间也算充足,抽点时间总结下OData的常用的使用方式,开放数据协议(OData)是一个查询和更新数据的Web协议.OData应用了web技术如HTTP.Atom发布协议(AtomPub)和 ...
- Jquery自定义扩展方法(一)
jquery是一款流行的JS框架,自定义JS方法,封装到Jquery中,调用起来也挺方便的,怎么写Jquery扩展方法那,网上翻阅了一部分代码,其实也挺简单的: 方式一: (jQuery.fn.set ...