zoukankan      html  css  js  c++  java
  • [WPF]使用自定义Panel更好地控制Resize时的行为——之二

    考虑下面这样的界面布局。

    image

    对于这个小窗口而言,东西少。可以把窗口定死在500*300这样。但是如果这个表单是属于一个大窗体的一个部分。情况就比较复杂了。

    我们并不能把窗口定死大小。因为窗口有可能会需要在1920*1200到1024*768等不同的分辨率下运行。这样这个表单在不同情况下的大小就有可能有很大的差别。

    一个比较好的方案是,当窗口变小,第一行放不下所有控件时。换到第二行。当窗口变大,第一行有多余地方时,把第二行的内容放在第一行上,使界面的右边不留空白。

    有人会大叫这不就是WrapPanel做的事情吗?没有错,但是WrapPanel的每一行都是左对齐的,右边会有大片的留白,这在想要设计有良好用户体验的软件中,是不可接受的。

    也就是说WPF自带的WrapPanel没有处理好下面这种情况。

    第一行有多余的空间,但是又不足以把第二行的什么控件放上来。

    这时,第一行的现有的控件应该充分利用第一行的所有可用空间,把第一行填满。这个是用WrapPanel做不到的。WrapPanel主要用于内部的Item的大小基本一样的情况。如果大小不一,WrapPanel就会造成不好的用户体验。还不如用Grid做等比例缩放好。

    很可惜,现在我们又要自己写一个WrapPanel了。如下图所示。

    image

    图1. FillWrapPanel Demo

    在这个Panel里的所有的Button都有 20的MinWidth和55的MaxWidth。并特意为3号Button设置了30的MaxWidth,为6号Button设置了100的MaxWidth。我们来看一下这个Panel在Resize时的行为。

    image

    图2. 再小就要换行了(原则是让所有控件都尽可能大,但是右边又不能留白)

    image

    图3. 缩到6号Button

    image

    图4. 缩到4号Button

    image

    图5. 最小

    如果用WPF的WrapPanel呢?结果很简单。

    image

    图6. WPF的WrapPanel(Item的大小是确定的,不会变化,而且右边会留白)

    系统的WrapPanel很适于实现Explorer里浏览文件、文件夹或是看图软件的缩略图模式。而本文中介绍的FillWrapPanel更适于实现类似表单的窗体。因为里面的东西大小很可能是各不相同的。

  • 相关阅读:
    redis数据结构底层剖析学习笔记2
    redis数据结构底层剖析学习笔记1
    java正则表达式学习笔记
    springmvc sessionfilter 登录过滤器
    Java中JSON字符串与java对象的互换实例详解
    用9种办法解决 JS 闭包经典面试题之 for 循环取 i
    近期流行的JavaScript框架与主题
    JavaScript 中的 this 问题总结 !
    常见前端面试题及答案(下)
    常见前端面试题及答案(上)
  • 原文地址:https://www.cnblogs.com/nankezhishi/p/customPanel2.html
Copyright © 2011-2022 走看看