Android 学习01

最新推荐文章于 2023-05-21 15:02:02 发布

weixin_30832405

最新推荐文章于 2023-05-21 15:02:02 发布

阅读量112

点赞数

文章标签：移动开发 java ui

原文链接：http://www.cnblogs.com/kevinOnes1/p/11231159.html

版权

一、Android的UI布局方式

1.使用XML文件布局

　　在Android应用的res/layout目录下编写XML布局文件：　activity_main.xml　

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="38dp"
        android:text="开心消消乐!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.01" />
</androidx.constraintlayout.widget.ConstraintLayout>

　　在MainActivity.java中，通过如下代码引入:

package com.kevin.happydispear;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);　　　　// 引入布局文件
        Log.d("MainActivity","onCreate execute");　　　// 使用日志调试
    }
}

　　2.使用Java代码布局

　　　　不需要使用布局文件activity_main.xml，可以删除该文件

package com.kevin.javalayout;

import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;

import android.content.DialogInterface;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.util.TypedValue;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        FrameLayout frameLayout = new FrameLayout(this);   // 创建一个真布局管理器
        frameLayout.setBackgroundResource(R.mipmap.back);   // 设置背景图片
        setContentView(frameLayout);                        // 设置布局管理器
        TextView textView = new TextView(this);
        textView.setText("Be A FaifulMan");
        textView.setTextSize(TypedValue.COMPLEX_UNIT_SP,18);// 设置字体
        textView.setTextColor(Color.rgb(14,54,126));        // 设置颜色
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT);
        params.gravity = Gravity.CENTER;
        textView.setLayoutParams(params);
        textView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                new AlertDialog.Builder(MainActivity.this).setTitle("系统提示：")
                        .setMessage("吸烟有害健康").setPositiveButton("确定",new DialogInterface.OnClickListener(){
                            @Override
                    public void onClick(DialogInterface dialogInterface,int which){
                                Log.i("桌面台球","进入游戏");
                                }
                }).setNegativeButton("退出", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialogInterface, int i) {
                        Log.i("桌面台球","退出游戏");
                        finish();
                    }
                }).show();
            }
        });
        frameLayout.addView(textView);
    }
}

3.使用XML+Java代码实现布局

　　　　MainActivity.java文件

package com.kevin.qqpictures;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.ViewGroup;
import android.widget.GridLayout;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {
    private ImageView[] imagesView = new ImageView[12];
    private int[] imagesPath = new int[]{
            R.mipmap.l01,R.mipmap.l02,R.mipmap.l03,
            R.mipmap.l04,R.mipmap.l05,R.mipmap.l06,
            R.mipmap.l07,R.mipmap.l08,R.mipmap.l09,
            R.mipmap.l10,R.mipmap.l11,R.mipmap.l12
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        GridLayout gridLayout = (GridLayout)findViewById(R.id.layout);
        for(int i=0;i<imagesPath.length; i++){
            imagesView[i] = new ImageView(MainActivity.this);
            imagesView[i].setImageResource(imagesPath[i]);
            imagesView[i].setPadding(2,2,2,2);
            ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(116,89);
            imagesView[i].setLayoutParams(params);
            gridLayout.addView(imagesView[i]);

        }
    }
}

　　main_activity.mxl文件

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/layout"
    android:orientation="horizontal"
    android:rowCount="3"
    android:columnCount="4"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

</GridLayout>

4.Android的布局管理器

4.1 RelativeLayout 相对布局

　　android:gravity 设置各子组件的摆放方式

　　android:ignoreGravity设置另一个组件不受前面的属性的影响

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:ignoreGravity="@id/myHelloWorld"
    tools:context=".LayoutManagerActivity"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        android:id="@+id/myHelloWorld"
        />

</RelativeLayout>

　　RelativeLayout.LayoutParams 一个嵌套类（内部类）

android:layout_above　　上面　　　　　　一个组件位于另一个组件的上面

android:layout_below 下面

android:layout_toLeftOf 左边

android:layout_toRightOf 右边

组件与父容器对齐方式

android:layout_alignParentBotton　　底部

android:layout_alignParentLeft　　　左边

android:layout_alignParentRight 右边

android:layout_alignParentTop 顶部

与某一组件对齐方式

android:layout_alignBotton　　　　　底部

android:layout_alignLeft 左边

android:layout_alignRight 右边

android:layout_alignTop 顶部

设置组件位于布局管理器的位置

android:layout_centerHorizontal　　　水平居中

android:layout_cneterInParent 中间位置

android:layout_centerVertical　　　　垂直居中

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"

    tools:context=".LayoutManagerActivity"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="文本1"
        android:layout_centerInParent="true"
        android:id="@+id/myText1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="文本2"
        android:id="@+id/myText2"
        android:layout_below="@id/myText1"
        />

</RelativeLayout>

　　实现一个软件的更新提示：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"

    tools:context=".LayoutManagerActivity"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="发现软件的更新版，需要安装吗？"
        android:layout_centerInParent="true"
        android:id="@+id/myText1"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="以后再说"
        android:id="@+id/button1"
        android:layout_below="@id/myText1"
        android:layout_alignRight="@id/myText1"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="立刻更新"
        android:id="@+id/button2"
        android:layout_below="@id/myText1"
        android:layout_toLeftOf="@id/button1"
        />
</RelativeLayout>

4.2 LinearLayout线性布局

android:orientation="vertical"　　垂直线性布局

android:orientation="horizontal" 水平线性布局

4.3 FrameLayout帧布局

4.4 TableLayout 表格布局

　　一个小小的实例

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".LayoutManagerActivity"
    android:shrinkColumns="1"
    android:background="@mipmap/nana"
    android:stretchColumns="0,3"
    >
   <TableRow android:paddingTop="200sp">
        <TextView />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="40dp"
            android:text="账   号"
            android:textSize="18sp"
            android:gravity="center_horizontal"
            />
        <EditText
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:hint="邮箱或者手机号码"
            />
       <TextView />
   </TableRow>
    <TableRow android:paddingTop="10sp">
        <TextView />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="40dp"
            android:text="密    码"
            android:textSize="18sp"
            android:gravity="center_horizontal"
            />
        <EditText
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:hint="请输入你的账号密码"
            android:background="#B7BAB5"
            />
        <TextView />
    </TableRow>
    <TableRow>
        <TextView />
        <Button
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:text="注   册"
            android:background="#78DA28"
            />
        <Button
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:text="登  录"
            android:background="#8F8CB7"
            />
        <TextView />
    </TableRow>
    <TableRow android:paddingTop="20dp">
        <TextView />
        <TextView />
        <TextView
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:text="忘记密码？"
            android:textColor="#FF4500"
            android:gravity="right"
            />
        <TextView />
    </TableRow>
</TableLayout>

4.5 GridLayout网格布局

转载于:https://www.cnblogs.com/kevinOnes1/p/11231159.html