安卓UI设计如何做到屏幕自适应

时间:2021-09-22 22:40:55

楼主寒假学习了一下关于安卓UI设计的东西,因为刚大一,再加上手残,所以进度很慢, 花了好久才解决了如何在各种不同的屏幕下才能做到控件不移位的效果。

因为是学生,所以对写博客这种东西实在不在行,所以请 见谅,也希望大家能帮我指导指导。

说道安卓布局,我平时用到最多的差不多就是线性布局LinearLayout和相对布局RelativeLayout ,一般的线性布局已经能做很多简单粗暴的界面,比如说计算器。线性布局有一个很重要也很实用的属性权重。(通俗地讲,权重(layout_weight)就是对线性布局指定方向(水平或垂直)上剩余空间分配的一个规则。)

 但是想要做一些更好的界面效果,必然要用到相对布局。但是用相对布局的话,屏幕大小不同,各种控件的位置就会跑偏,所以,这时候就要用到布局嵌套的方法。

下面是楼主成功实现的第一个屏幕自适应的例子。安卓UI设计如何做到屏幕自适应

效果图:安卓UI设计如何做到屏幕自适应

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
android:background="@drawable/beijing" >

<LinearLayout
android:id="@+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center"
android:layout_centerHorizontal="true"

>

<ImageView
android:id="@+id/imageView1"
android:layout_marginTop="120dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/ic_launcher" />
</LinearLayout>

<LinearLayout
android:id="@+id/two"
android:paddingTop="30dp"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/one">

<TextView
android:id="@+id/TextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="账号:"
android:layout_marginLeft="40dp"
android:textAppearance="?android:attr/textAppearanceLarge" />

<EditText
android:id="@+id/EdiText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.65"
android:hint="请输入账号"
android:ems="10"

/>

<requestFocus android:layout_width="match_parent" />

<EditText />
</LinearLayout>

<LinearLayout
android:id="@+id/three"
android:paddingTop="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/two">
<TextView
android:id="@+id/TextView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="密码:"
android:layout_marginLeft="40dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="@+id/EditText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.65"
android:hint="请输入密码"
android:ems="10"

/>

<requestFocus />

<EditText android:layout_height="match_parent" />

</LinearLayout>

<LinearLayout
android:id="@+id/four"
android:orientation="vertical"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/three">

<Button
android:id="@+id/Button1"
android:background="@drawable/denglu"
android:text="登 录"

android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

</LinearLayout>




<LinearLayout

android:layout_alignParentBottom="true"
android:id="@+id/five"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>

<TextView
android:id="@+id/TextView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"

android:textAppearance="?android:attr/textAppearanceLarge"

android:text="无法登录"/>
<View
android:layout_width="0dp"
android:layout_weight="1.0"
android:layout_height="0dp"/>
/////444

<TextView
android:id="@+id/TextView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"

android:gravity="right"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="新用户"/>





</LinearLayout>

</RelativeLayout>