做个安卓 UI 小项目:仿照西瓜视频首页 UI界面

本文详述了一位安卓开发者如何构建一个仿西瓜视频首页的UI界面,重点介绍了Relative Layout的使用,包括其常用属性、布局分布、与兄弟组件的相对定位、内外边距设置以及居中方法。内容涵盖了多个小布局的设计,如HorizontalScrollView和ScrollView的应用。
摘要由CSDN通过智能技术生成

1. 最终的效果图

 

2. 总体的大的布局分布

 

实际代码的总体布局:

 

2.0 RelativeLayout常用的一些属性

由于在本示例中采用了很多的 RelativeLayout 布局,所以先了解些它的基本布局属性

 

重点:相对布局 (RelativeLayout) 以 父容器 或者 兄弟组件 参考+margin +padding 来设置组件的显示位置

wrap_content 和 match_parent 的区别:

wrap 翻译过来是包裹,conten是内容。

那么这个就是包裹内容的意思,也就是说你的控件里面的内容有多大,这个控件就有多大。比如说Button中的文字

2.  match_parent:  让作用的控件填充满父容器的空间

1. 基本属性

XML 属性 说明
android:gravity 设置容器内组件的排序方式
android:ignoreGravity 如果设置改属性为 true,将忽略 android:gravity

android:gravity 本元素所有子元素的重力方向,处于怎样子的位置 ,有:

top 将对象放在其容器的顶部,不改变其大小. 

bottom 将对象放在其容器的底部,不改变其大小. 

left将对象放在其容器的左侧,不改变其大小. 

right将对象放在其容器的右侧,不改变其大小. 

center_vertical 将对象纵向居中,不改变其大小. 

android:layout_gravity 和 android:gravity 的区别:

比如说对于Button控件:

 

android:layout_gravity 表示button在界面上的位置

android:gravity表示button上的字在button上的位置。

 

2.根据父容器定位属性:

XML 属性 说明
android:layout_alignParentLeft 左对齐父容器
android:layout_alignParentRight 右对齐父容器
android:layout_alignParentTop 顶部对齐父容器
android:layout_alignParentBottom 底部对齐父容器
android:layout_centerHorizontal 在父容器中水平居中
android:layout_centerVertical 在父容器中垂直居中
android:layout_centerInParent 在父容器的居中位置

各个属性示意图如下

3. 根据兄弟组件定位属性

XML 属性 说明
android:layout_toLeftOf 紧贴参考组件的左边
android:layout_toRightOf 紧贴参考组件的右边
android:layout_above 紧贴参考组件的上方
android:layout_below 紧贴参考组件的下方
android:layout_alignTop 对齐参考组件的上边界
android:layout_alignBottom 对齐参考组件的下边界
android:layout_alignLeft 对齐参考组件的左边界
android:layout_alignRight 对齐参考组件的右边界

兄弟组件定位就是处于同一层次容器的组件

图中的组件1,2就是兄弟组件了,

如对于组件2 :android:layout_right = "@id/组件1"

而组件3与组件1或组件2并不是兄弟组件,所以组件3 不能通过 组件1或 2来进行定位

 

4. 设置外边距(偏移)属性

XML 属性 说明
android:layout_maring 设置组件上下左右的偏移量
android:layout_marginLeft 设置组件左边的偏移量
android:layout_marginRight 设置组件右边的偏移量
android:layout_marginTop 设置组件上边的偏移量
android:layout_marginBottom 设置组件下边的偏移量

上面这些属性用于设置组件对本来位置的偏移量

虚线框是组件2 本来的位置,如果设置了组件上边和左边的边距,则位置会发生一定的偏移,向右下偏移

 

5. 设置内边距(填充)属性

XML 属性 说明
android:padding 设置组件上下左右的填充
android:paddingLeft 设置组件左边的填充
android:paddingRight 设置组件右边的填充
android:paddingTop 设置组件上边的填充
android:paddingBottom 设置组件下边的填充

上面这些属性用于设置组件的内边距,内边距主要用于设置组件边框和子组件之间的间隙

6. 居中设置

android:layout_centerHorizontal 如果为true,将该控件的置于水平居中;
android:layout_centerVertical 如果为true,将该控件的置于垂直居中;
android:layout_centerInParent 如果为true,将该控件的置于父控件的中央;

 

2.1 小布局 之 RelativeLayout

在 其中也嵌套着 2 个 RelativeLayout 布局

    <RelativeLayout
        android:layout_marginTop="27dp"
        android:paddingRigh
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值