如何更改ui-grid行的高度? [英] How to change height of ui-grid row?
问题描述
我正在使用 ui-grid.我有很多行,这就是我使用滚动的原因.一切正常,直到我尝试更改行的高度.然后滚动变得一团糟.我在这里添加了一个例子 http://plnkr.co/edit/S6ylwOVgcQp7CSsZZxpR?p=preview这是来自 ui-grid 网站的教程之一 - 我唯一改变的是 CSS.我已经添加了这些规则.
I am using ui-grid. I have a lot of rows and that is why I use scrolling. Everything works perfectly ok until I try to change the height of the rows. Then the scrolling becomes a mess. I have added an example here http://plnkr.co/edit/S6ylwOVgcQp7CSsZZxpR?p=preview This is one of the tutorials from the ui-grid website - the only thing I have changed is the CSS. I have added these rules.
.ui-grid-cell-contents {
padding: 1px 1px;
}
.ui-grid-render-container-body .ui-grid-header-cell,
.ui-grid-render-container-left .ui-grid-header-cell,
.grid .ui-grid-row,
.grid .ui-grid-cell,
.grid .ui-grid-cell .ui-grid-vertical-bar {
height: 22px !important;
font-size: 12px;
line-height: 20px;
}
.ui-grid-render-container-body .ui-grid-header-cell,
.ui-grid-render-container-left .ui-grid-header-cell,
ui-grid-header-cell {
height: 55px !important;
}
.ui-grid-filter-container {
padding: 1px 3px;
}
如果删除上述 CSS 规则,滚动就可以正常工作.所以我要么需要添加更多的 CSS 规则,要么我需要使用网格的一些 API 来正确设置行高.任何帮助都感激不尽.
Scrolling works perfectly ok if the above CSS rules are removed. So I either need to add more CSS rules or I need to use some API of the grid in order to set row height properly. Any help will be much appreciated.
如何更改行高并保持滚动流畅?
How do I change row height and keep scrolling smooth?
更新:这是默认网格和修改 CSS 的网格之间的比较:http://plnkr.co/edit/x1nQGvpkY4bRMs9D09Ws?p=preview尝试为每个网格上下滚动行.区别应该很明显.
UPDATE: Here is a comparison between a default grid and one with modified CSS: http://plnkr.co/edit/x1nQGvpkY4bRMs9D09Ws?p=preview try to scroll the rows up and down for each grid. The difference should be pretty obvious.
推荐答案
拿出来:
height: 22px !important;
从 css 中添加:
rowHeight:22
到 gridOptions.
to the gridOptions.
我感觉这更流畅.
这篇关于如何更改ui-grid行的高度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!