iT邦幫忙

2021 iThome 鐵人賽

DAY 29
0
自我挑戰組

Android 初新者系列 第 29

Day29 - Activity & Intent跳頁

我們都知道APP一般濤說不會只有一個頁面
通常都有按鈕可以跳到另一頁或是跳回原本那頁
Android的APP通常是由多個Activity組成
一個Activity其實可以代表一個畫面

今天就來新增一個Activity,也就是一個新的頁面
並且透過Intent來轉跳畫頁

開始

  • 第一頁
    xml檔:activity_main.xml
    java檔:MainActivity.java

  • 第二頁
    xml檔:activity_two.xml
    java檔:Two.java

先來新增第二個頁面八

  • 到左邊目錄欄java -> 右鍵com.example.intent -> New -> Activity ->Empty Activity 點下去
    https://ithelp.ithome.com.tw/upload/images/20211005/20141769oATx7ixney.png
  • 把Activity Name 改為:Two,按下Finish
    https://ithelp.ithome.com.tw/upload/images/20211005/20141769hnWcVUTUIJ.png
  • 目錄頁就會多Two.java、 activity_two.xml
    https://ithelp.ithome.com.tw/upload/images/20211005/201417692OsXw4cTAU.png

第一頁

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">
    <Button
        android:id="@+id/btn_totwo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="跳第二頁"
        android:textSize="30dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.java

新增Intent
Intent intent = new Intent(MainActivity.this,想要跳到的頁面)

Intent intent = new Intent(MainActivity.this,Two.class);

之後再啟動intent跳頁

startActivity(intent);

完整程式:

package com.example.intent;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
    Button btn_totwo;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        btn_totwo = findViewById(R.id.btn_totwo);
        btn_totwo.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent intent = new Intent(MainActivity.this,Two.class);
                startActivity(intent);
            }
        });
    }
}

第二頁

activity_two.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=".Two"
    android:background="@color/black">
    <Button
        android:id="@+id/btn_back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="跳回去"
        android:textSize="30dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Two.java

只需要在點擊事件內加上finish()即可
finish():結束此頁面,跳回上一個頁面
完整程式:

package com.example.intent;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class Two extends AppCompatActivity {
    Button btn_back;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_two);
        btn_back = findViewById(R.id.btn_back);
        btn_back.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                finish();
            }
        });
    }
}

執行結果:

  • 初始畫面
    https://ithelp.ithome.com.tw/upload/images/20211005/20141769eNyganFk4v.png
  • 按下跳第二頁,跳到Two頁
    https://ithelp.ithome.com.tw/upload/images/20211005/20141769SifMgvdylR.png
  • 按下跳回去,回第一頁
    https://ithelp.ithome.com.tw/upload/images/20211005/20141769p6j2dDcu6I.png

上一篇
Day28 - TimePickerDialog
下一篇
Day30 - Intent傳訊息
系列文
Android 初新者30

尚未有邦友留言

立即登入留言