Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐

发布时间:2019-06-27 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

作为一名做AndROId开发的老实(jian)人,你也有过被UI设计恶心到的经历吧,吐槽过后,来分享下小经验吧~

漂亮的UI设计MM给了我一个这样的设计:

clipboard.png

好兴奋,好easy,我要大显身手了。

<RelativeLayout >"http://schemas.android.COM/apk/res/android"
    >"http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button 
        android:id="@+id/i_am_nuts"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:layout_marginLeft="50dp"
        android:layout_marginTop="50dp"
        android:text="I am nuts" 
        android:background="@android:color/holo_green_light"/>
    
    <Button 
        android:id="@+id/i_am_up"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:layout_toRightOf="@id/i_am_nuts"
        android:text="I am up" 
        android:background="@android:color/holo_blue_light"/>
    
</RelativeLayout>

轻松搞定,toRightOf就ok,截图show一下。

clipboard.png

MM下班回家又检视了下UI,觉得这图像手指在勾引,不符合主流价值观啊,第二天让我修改成了这样:

Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐

恩,easy,toRightOf再below:

<RelativeLayout >"http://schemas.android.com/apk/res/android"
    >"http://schemas.android.com/tools"
    android_layout_width="match_parent"
    android_layout_height="match_parent">

    <Button 
        android_id="@+id/i_am_nuts"
        android_layout_width="wrap_content"
        android_layout_height="200dp"
        android_layout_marginLeft="50dp"
        android_layout_marginTop="50dp"
        android_text="I am nuts" 
        android_background="@android:color/holo_green_light"/>
    
    <Button 
        android_id="@+id/i_am_up"
        android_layout_width="wrap_content"
        android_layout_height="wrap_content"
        android_layout_marginTop="50dp"
        android_layout_toRightOf="@id/i_am_nuts"
        android_text="I am up" 
        android_background="@android:color/holo_blue_light"/>
    
    
    <Button 
        android_id="@+id/look_at_me"
        android_layout_width="wrap_content"
        android_layout_height="wrap_content"
        android_layout_below="@id/i_am_up"
        android_layout_toRightOf="@id/i_am_nuts"
        android_text="Look at me" 
        android_background="@android:color/holo_red_light"/>
    
</RelativeLayout>

MM还是觉得有点像勾引,对,向下对齐就彻底不像勾引了,自觉聪慧的MM第三天给了我这样的设计:

Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐


MM没有给出红蓝色块的margin,但明确红块需要与绿块底部对齐。
哈哈,幸好哥用的是RelativeLayout,哥真是有先见之明啊,直接用layout_alignBottom就可以了嘛。
将look_at_me按钮改成这样:

<Button 
        android_id="@+id/look_at_me"
        android_layout_width="wrap_content"
        android_layout_height="wrap_content"
        android_layout_below="@id/i_am_up"
        android_layout_toRightOf="@id/i_am_nuts"
        android_layout_alignBottom="@id/i_am_nuts"
        android_text="Look at me" 
        android_background="@android:color/holo_red_light"/>

run一下看看(信心满满):

Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐

(捂脸)

Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐

不是layout_height="wrap_content"吗,我的按钮怎么被拉伸了~

当我们同时使用layout_below和layout_alignBottom时,系统计算空间高度时会出错,我就不跟代码了,我是懒虫。与此类似,在同时使用layout_toRightOf和layout_alignRight等属性时也会有同样的问题。

去掉layout_below:

Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐

有时候问题不大,却很恼人,希望能给瞥到该文的同学们带来一点小帮助,避免一些小麻烦。

脚本宝典总结

以上是脚本宝典为你收集整理的Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐全部内容,希望文章能够帮你解决Android面对奇葩布局时的小经验(一)-RelativeLayout中的对齐所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。