Ext4使用总结（二）简单的hbox布局

最新推荐文章于 2020-04-12 14:08:59 发布

跑步的小伙子

最新推荐文章于 2020-04-12 14:08:59 发布

阅读量3.7k

点赞数

分类专栏：前端开发

本文链接：https://blog.csdn.net/lihxa2002/article/details/53063520

版权

前端同时被 2 个专栏收录

16 篇文章 0 订阅

订阅专栏

开发

15 篇文章 0 订阅

订阅专栏

布局的合理利用：
如图：

{
                            xtype:'container',
                            margins:'5 0 0 0',
                            layout:{
                                align:'stretch',
                                type:'hbox'
                            },
                            items:[
                                {
                                    xtype:'fieldcontainer',
                                    margins:'5 0 0 0',
                                    fieldLabel:'AAAA',
                                    combineErrors: true,
                                    labelWidth: 130,
                                    labelAlign: 'right',
                                    flex:1,
                                    defaults:'hideLabel: true',
                                    layout:{
                                        align:'stretch',
                                        type:'hbox'
                                    },
                                    items:[
                                        {
                                            xtype:'textfield',
                                            flex:1
                                        },
                                        {
                                            xtype:'displayfield',
                                            margins: '0 5 0 5',
                                            value:'至'
                                        },
                                        {
                                            xtype:'textfield',
                                            flex:1
                                        }
                                    ]
                                },
                                {
                                    xtype:'fieldcontainer',
                                    margin:'5 0 0 0',
                                    fieldLabel:'BBBB',
                                    combineErrors: true,
                                    labelWidth:130,
                                    labelAlign:'right',
                                    flex:1,
                                    defaults:'hideLabel: true',
                                    layout:{
                                        align:'stretch',
                                        type:'hbox'
                                    },
                                    items:[
                                        {
                                            xtype:'textfield',
                                            flex:1
                                        },
                                        {
                                            xtype:'displayfield',
                                            margins: '0 5 0 5',
                                            value:'至'

                                        },
                                        {
                                            xtype:'textfield',
                                            flex:1

                                        }
                                    ]
                                }
                            ]
                        }