08：ユーザーインターフェース設計の実験

5-1個人金融コミュニケーションのシステム設計ページの相対的なレイアウト設計を実現する

//RelativeLayout 相对布局管理器 xmlns:android命名空间的声明
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    //xmlns:tools布局默认工具
    android:layout_width="match_parent"
    //屏幕上所占的宽度
    android:layout_height="match_parent"
    //屏幕上所占的高度
    tools:context=".MainActivity" >
	
	//文本框
 	<TextView
        android:id="@+id/h1"
        //设置组件的唯一标识符
        android:layout_width="wrap_content"
        //所占宽度
        android:layout_height="wrap_content"
        //所占高度
        android:text="请输入密码：" 
        android:textSize="20sp"/>
    //编辑框
	<EditText 
	    android:id="@+id/h2"
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    //内隐的提示框
	    android:hint="请输入密码："
	    android:textSize="15sp"
	    android:layout_below="@id/h1"
	    //android:layout_below其属性值为其他UI组件的Id属性用于指定该组件位于哪个组件的下方
	    android:inputType="textPassword"
	    />
	 //按钮
	<Button 
	    android:id="@+id/quxiao"
	    android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		//在属性H2的下方
	    android:layout_below="@id/h2"
	    android:layout_alignParentRight="true"
	    //layout_alignParentRight 用于指定该组件是否与布局管理器右对齐
	    android:text="取消"
	    />
	<Button 
	    android:id="@+id/queding"
	    android:layout_width="wrap_content"
	    android:layout_height="wrap_content"
	    android:text="设置"
	    android:layout_toLeftOf="@id/quxiao"
	    //位于该组件的左侧
	    android:layout_below="@id/h2"
	    //位于该组件的下方
	    />
</RelativeLayout>

デフォルトでは、画面の左上隅にテキストボックスtvPwdが表示され、下部に編集ボックスが設定され、編集キャンセルは編集ボックスの下にあり、親コンテナの右側に配置されています。最後に、設定ボタンは編集ボックスの左側ではなく下部にあります。

5-2リニアレイアウトデザインパーソナルファイナンスの新しいノートページ

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" 
    android:orientation="vertical">

   <TextView 
        android:id="@+id/tv1"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="新增便签"
        android:textSize="30sp"
        android:textStyle="bold"
        android:layout_gravity="center"
        />
 	<TextView 
        android:id="@+id/tv2"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="请输入便签，最多输入200字"
        android:textSize="20sp"
        /> 
    <EditText 
        android:id="@+id/ed1"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
		android:lines="10"
		android:gravity="top"
        /> 
        <RelativeLayout   
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            >
             <Button
	        android:id="@+id/btn1" 
	        android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="取消"
	        android:textSize="25dp"
			android:layout_alignParentRight="true"
			android:layout_marginLeft="20dp"
	        />
	    <Button 
	        android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="保存"
	        android:textSize="25dp"
			android:layout_toLeftOf="@id/btn1"
	        />  
            
          </RelativeLayout>
</LinearLayout>