[英]How to disable border line of Ext JS panel and Toolbar?
我試圖隱藏邊界線,但不能成功! 這是提到的邊界線的屏幕截圖 。
您會注意到,在“導出Excel”和radiofield
之間會出現一條垂直線。 在下面,您將找到一些包含這些元素的代碼段。 我使用了Toolbar
和panel
來創建這些項目。 因此,對每個類嘗試了幾種配置,例如border: false
, frame: false
, bodyBorder: false
,但沒有一個可以成功隱藏此行。
感謝您的建議。
return [
{
xtype: 'panel',
scrollable: true,
// border: false,
// bodyBorder: false,
// frame: false,
layout: {type: 'hbox', align: 'middle', pack: 'start'},
items: [
{
xtype: 'panel',
// border: false,
// bodyBorder: false,
items: me.listToolbar() //This is end of 'toolbar' class.
},
{
xtype: 'panel',
items: me.subModuleTb() //'radiofield' starts by here
}
]
}
];
這就是所謂的ListToolbar類:
Ext.define('MyApp.ListToolbar', {
extend: 'Ext.toolbar.Toolbar',
alias: 'widget.listtoolbar',
requires: [],
dock: 'top',
//border: 0, //This is not disappear the line as well
//cls: 'list-toolbar //Defined 'border' as zero on all.scss for this cls but did not worked as well!
layout: {
type: 'table',
tdAttrs: { style: 'padding: 5px 10px;' }
},
defaults: {
enableToggle: true
},
scope:this,
items: [
您正在使用什么版本? 我希望該邊框出現在工具欄中。 您可以在工具欄中使用“邊框”:0屬性。 或者您可以通過添加“ Cls”屬性在CSS中進行控制。
Ext.create('Ext.toolbar.Toolbar', {
renderTo: document.body,
**border:0,**
width : 500,
items: [
{
// xtype: 'button', // default for Toolbars
text: 'Button'
},
{
xtype: 'splitbutton',
text : 'Split Button'
},
// begin using the right-justified button container
'->', // same as { xtype: 'tbfill' }
{
xtype : 'textfield',
name : 'field1',
emptyText: 'enter search term'
},
// add a vertical separator bar between toolbar items
'-', // same as {xtype: 'tbseparator'} to create Ext.toolbar.Separator
'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.toolbar.TextItem
{ xtype: 'tbspacer' },// same as ' ' to create Ext.toolbar.Spacer
'text 2',
{ xtype: 'tbspacer', width: 50 }, // add a 50px space
'text 3'
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.