页面布局

1.LinerLayout(线性布局):

注意: Android 的线性布局不会换行,当组件一个挨着一个的排列到头之后,剩下的组件将不会被显示出来

  • android:orientation="horizontal"设置布局管理器的内组件排列方式:horizon(水平排列)、vertical(垂直排列)

 

 

  • androidgravity="left|center_vertical" :设置布局管理器内组件的对齐方式

该属性值可设为 top(顶部对齐) bottom(底部对齐) left(左对齐) right(右对齐) center_vertical(垂直方向居中) fill_vertical(垂直方向填充)  center_horizontal(水平方向居中) fill_horizontal(水平方向填充) center(垂直与水平方向都居中) fill (填充)、  clip_vertical(垂直方向裁剪)   clip_horizontal(水平方向裁剪) 

可同时指定多种对其方式的组合,中间用“|”连接,如下方代码设置对齐方式为 left|center_vertical 表示出现在屏幕左边且垂直居中

除以上两个常用属性外,LinearLayout 的属性还有以下几个:

androidbaselineAligned            该属性设为 false ,将会阻止该布局管理器与它的子元素的基线对其。

  androiddivider                设置垂直布局时两个按钮直接的分隔条。

  androidmeasureWithLargestChild      该属性设为 true 时,所有带权重的子元素都会具有最大子元素的最小尺寸。

最后介绍一下 LinearLayout 子元素支持的常用属性:

  androidlayout_gravity    指定该子元素在 LinearLayout 中的对其方式

  androidlayout_weight    指定该子元素在 LinearLayout 中所占的权重          

 

 

 

 

 

 

 

2.ConstraintLayout(约束布局)★★★

该布局方式直接用页面调整各组件的位置特别方便

ConstraintLayout 能够灵活地定位和调整子View的大小,子 View 依靠约束关系来确定位置。在一个约束关系中,需要有一个 Source(源)以及一个 Target(目标),Source 的位置依赖于 Target,可以理解为“通过约束关系,Source 与 Target链接在了一起,Source 相对于 Target 的位置便是固定的了

 

3.RelativeLayout(相对布局)

和上面的约束布局差不多;差别在于它好像就是相对边框的位置。

4.FrameLayout(帧布局)

用的很少;这种布局没有方便的定位方式,所有控件默认都是布局在左上角

5.ListView(滚动控件   像列表一样展示数据)

不详解,因为它只是纵向上展示,没有横向

6.RecyclerView

使用:

注意:现在引入不用compile

implementation 'com.android.support:recyclerview-v7:28.0.0-rc02'

 详细信息网上查

 

 

 

 

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ECharts是一个基于JavaScript的开源可视化库,用于构建交互式的数据可视化图表。在ECharts中,页面布局主要通过HTML和CSS来实现。 一般来说,ECharts的页面布局可以分为以下几个步骤: 1. 引入ECharts库:在HTML文件中引入ECharts的JavaScript文件,可以通过CDN或者本地文件引入。 2. 创建容器:在HTML文件中创建一个容器元素,用于承载ECharts图表。可以使用div元素,并为其指定一个唯一的id属性。 3. 设置容器样式:使用CSS样式为容器元素设置宽度和高度,以及其他样式属性,以适应页面布局需求。 4. 初始化图表对象:在JavaScript代码中,通过调用echarts.init()方法初始化一个图表对象,并传入容器的id属性作为参数。 5. 配置图表选项:通过设置图表对象的option属性,配置图表的各种选项,包括图表类型、数据、样式等。 6. 渲染图表:调用图表对象的setOption()方法,将配置好的选项应用到图表中,并渲染出来。 下面是一个简单的示例代码: HTML部分: ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ECharts页面布局示例</title> <style> #chartContainer { width: 600px; height: 400px; } </style> </head> <body> <div id="chartContainer"></div> <script src="echarts.min.js"></script> <script src="main.js"></script> </body> </html> ``` JavaScript部分(main.js): ```javascript // 初始化图表对象 var chart = echarts.init(document.getElementById('chartContainer')); // 配置图表选项 var option = { title: { text: '柱状图示例' }, xAxis: { data: ['A', 'B', 'C', 'D', 'E'] }, yAxis: {}, series: [{ name: '销量', type: 'bar', data: [5, 20, 36, 10, 10] }] }; // 渲染图表 chart.setOption(option); ``` 以上代码演示了一个简单的柱状图示例,通过设置容器的宽度和高度,以及配置图表选项,实现了ECharts的页面布局

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值