从上一篇关于ListView布局样式的文章中，我们知道XAFBlazor是移动优先的，如果想在PC端有更好的用户体验，我们需要对布局样式进行修改。这篇介绍在之前文章中提到的FilterPanel，它的样式调整稍微要复杂一些，但思路与之前的差不多。

当过滤项过多时，FilterPanel会变高，超出了容器的高度后，整个容器会出现滚动条，如下图

我们需要的是过滤项多时，在DxTreeView内部出现滚动条，如下图

由于DxTreeView并不支持这个功能，我们需要修改其内部布局样式，下面是修改演示

下面是Blazor组件中的DOM结构

下面是样式代码

XAF Blazor FilterPanel 布局样式的更多相关文章

  1. CSS3知识点整理（四）----布局样式及其他

    包括CSS3多列布局样式.Flexbox伸缩布局.盒子模型等.重点介绍了Flexbox伸缩布局的各种属性用法. 一.多列布局 为了能在Web页面中方便实现类似报纸.杂志那种多列排版的布局,W3C特意给 ...

  2. Android开发工程师文集-Fragment，适配器，轮播图，ScrollView，Gallery 图片浏览器，Android常用布局样式

    Android开发工程师文集-Fragment,适配器,轮播图,ScrollView,Gallery 图片浏览器,Android常用布局样式 Fragment FragmentManager frag ...

  3. CSS（非布局样式）

    CSS(非布局样式) 问题1.CSS样式(选择器)的优先级 1.计算权重 2.!important 3.内联样式比外嵌样式高 4.后写的优先级高 问题2.雪碧图的作用 1.减少 HTTP 请求数,提高 ...

  4. 万能的TextView,实现常用布局样式

    package com.loaderman.textviewdemo; import android.content.Context; import android.content.res.Typed ...

  5. Android布局样式

    本篇介绍一下Android中的几种常用的布局,主要介绍内容有: ·View视图 ·LinearLayout ·RelativeLayout 在介绍布局之前,我们首先要了解视图View的基本属性,因为所 ...

  6. css进阶 01-CSS中的非布局样式

    01-CSS中的非布局样式 #前言 CSS中,有很多非布局样式,这些样式(属性)和与布局无关,包括: 字体.字重.颜色.大小.行高 背景.边框 滚动.换行 装饰性属性(粗体.斜体.下划线)等. 这篇文 ...

  7. XAF响应式布局皮肤界面展示

    XAF为了对手机.平板电脑的支持,增加了新的响应式布局皮肤支持,这个功能已经出来很久了,对于平板电脑.PC的支持已经很不错了,对于手机的界面还不是很完美. 本篇展示一下当前的效果,让有需要的同学.还没 ...

  8. css3 flex流动自适应响应式布局样式类

    1.再说css3 flex 一旦一个容器赋予了display:flex属性,将会有以下特点: 项目无法设置浮动. 列表的样式会被清除. 无法使用vertical-align设置垂直对齐方式. 目前互联 ...

  9. flex 4 布局样式

    Flex 4 样式与布局 第一篇 Flex 4 与自定义布局(Layout) Flex 4/Spark组件架构的新功能之一是可以定制一个容器的布局而不必改变容器本身.您需要做的就是定义一个自定义布局. ...

  10. CSS3学习系列之布局样式（二）

    使用盒布局 在CSS3中,通过box属性来使用盒布局,例子如下: <!DOCTYPE html> <html lang="en"> <head> ...

随机推荐

  1. BigDecimal详解和精度问题

    JavaGuide :「Java学习+面试指南」一份涵盖大部分 Java 程序员所需要掌握的核心知识. BigDecimal 是大厂 Java 面试常问的一个知识点. <阿里巴巴 Java 开发 ...

  2. Milvus性能优化提速之道：揭秘优化技巧，避开十大误区，确保数据一致性无忧，轻松实现高性能

    Milvus性能优化提速之道:揭秘优化技巧,避开十大误区,确保数据一致性无忧,轻松实现高性能 Milvus 是全球最快的向量数据库,在最新发布的 Milvus 2.2 benchmark中,Milvu ...

  3. 安装kali linux操作系统（转） - 初学者系列 - 学习者系列文章

    前段时间想到操作系统安全问题,所以对操作系统的防火墙和安全软件都进行了安装.然后,涉及到Linux系统的安全测试问题,所以找到了Linux系统里的安全测试的版本Kali Linux系统.本文仅对该系统 ...

  4. Linux C/C++ 获取进程号、线程号和设置线程名

    1 前言 在Linux开发过程中,设计多线程开发时可以将进程和线程的 id 打印出来,方便开发调试和后期查问题使用,同时也包括设置线程名. 2 函数及头文件 2.1 进程ID #include < ...

  5. Linux--Vi编辑命令(插入、替换、命令行模式、撤销)

    1.进入插入模式(6个命令) [i] 从目前光标所在处插入 [I] 从目前光标 [a] 从当前光标所在的下一个字符处开始插入 [A] 从光标所在行的最后一个字符处开始插入 [o] 英文小写字母o,在目 ...

  6. 序列化协议：Protobuf入门

    偶然在网上清华大学电子系科协软件部2023暑期培训的内容中发现了这个东西,后面随着了解发现以后学习有关项目时会用到,便写个随笔记录一下这次学习的经历.作为一种序列化协议,与使用文本方式存储的xml.j ...

  7. IIS配置跨域

    在IIS里找到HTTP响应标头 添加如下两个标头 Access-Control-Allow-Headers:Content-Type, api_key, Authorization Access-Co ...

  8. linux 测试网络速率

    1. ethtool ethtool是很强大的查询网卡(嵌入式称为phy芯片)配置的工具,几乎phy芯片芯片手册寄存器能配置的选项,ethtool都能查询到:嵌入式调试phy芯片的时候经常用到该命令: ...

  9. 【Unity3D】选中物体描边特效

    1 前言 ​ 描边的难点在于如何检测和识别边缘,当前实现描边特效的方法主要有以下几种: ​ 1)基于顶点膨胀的描边方法 ​ 在 SubShader 中开 2 个 Pass 渲染通道,第一个 Pass ...

  10. 【Unity3D】摇杆

    1 需求实现 ​ 1)需求实现 鼠标拖拽摇杆球控制坦克移动: 上下左右按键也可以控制坦克移动,并且摇杆球也同步移动: 鼠标右键滑动,控制坦克转向: 相机在玩家后上方的位置,始终跟随玩家,朝玩家正前方看 ...