第19天~dialog+Menu

2021 iThome 鐵人賽

DAY 19

Mobile Development

就是從無到有寫app系列第 19 篇

13th鐵人賽

Tzu

2021-10-04 06:29:12

850 瀏覽

分享至

dialog的DEMO

掀開新檔

id命名為btnalert

onClick從java檔來加入

再來是比較難的code

package com.huang.alert_dialog;

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

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

public class MainActivity extends AppCompatActivity {
    Button alert;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        alert = (Button) findViewById(R.id.btnalert);
        alert.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                AlertDialog alertDialog = new AlertDialog.Builder(MainActivity.this).create();

                alertDialog.setTitle("靠自己好嗎?");
                alertDialog.setMessage("穩步踏實，則百事方佳~~");
                alertDialog.setButton(AlertDialog.BUTTON_NEUTRAL, "OK",
                        new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialogInterface, int i) {
                                dialogInterface.dismiss();
                            }
                        }


                );

                alertDialog.show();
            }
        });
    }
}

Menu-就是手機上面的"三個點"

2種方法-這裡寫第1種用xml檔-layout+menu.xml

新增檔案-

再從res-new-Android Resource Directory

然後選type-選menu-上面會自己變

res夾–> 右 -->新增 resourse dir --> type:menu --> new resource file

menu/menu_main.xml
然後再從menu的右鍵去new-Menu Resource File

制定名稱-

長這樣~

整個就是menu-還有裡面的button

拉入Menu Item

id+title+icon都要做

顯示在哪的
showAsAction="always"
要用空格點2下會挑出可以V~

設置 showAsAction

ifRoom：如果 toolbar 上有位置才顯示，不然會在三個點點擊之後才出現

never：不顯示在界面上，只在三個點點擊之後才出現

always：會顯示在 toolbar 上

先看到icon再看到title
如果沒有icon就會直接看到title

這裡反而是手打程式碼不會動~是要按格子

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

    <item
        android:id="@+id/Item01"
        android:icon="@android:drawable/btn_star_big_on"
        android:title="AA"
        app:showAsAction="always" />
</menu>

visible是否顯示

enabled是否可用

再寫第2個沒有寫always就會被收在第2個

選擇 ifRoom

目前顯示

ifRoom：如果 toolbar 上有位置才顯示，不然會在三個點點擊之後才出現

never：不顯示在界面上，只在三個點點擊之後才出現

always：會顯示在 toolbar 上

第3個選never

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

    <item
        android:id="@+id/Item01"
        android:icon="@android:drawable/btn_star_big_on"
        android:title="AA"
        app:showAsAction="always" />
    <item
        android:id="@+id/Item02"
        android:icon="@android:drawable/ic_btn_speak_now"
        android:title="BB"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/Item03"
        android:icon="@android:drawable/ic_dialog_email"
        android:title="CC"
        app:showAsAction="never" />
</menu>

如果沒有特別寫就是showAsAction="never"

然後item04下面再放menu讓他一層又一層

顯示

下面第1個item寫-

下面第2個item寫-

程式碼:


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

    <item
        android:id="@+id/Item01"
        android:icon="@android:drawable/btn_star_big_on"
        android:title="AA"
        app:showAsAction="always" />
    <item
        android:id="@+id/Item02"
        android:icon="@android:drawable/ic_btn_speak_now"
        android:title="BB"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/Item03"
        android:icon="@android:drawable/ic_dialog_email"
        android:title="CC"
        app:showAsAction="never" />
    <item
        android:id="@+id/Item04"
        android:title="OTHER" >
        <menu >
            <item
                android:id="@+id/sub01"
                android:title="DD01" />
            <item
                android:id="@+id/sub02"
                android:title="DD02" />
        </menu>
    </item>
</menu>

目前模擬器是看不到東西的

從java檔讓menu顯示-右鍵Generate-->Override

安卓快捷鍵
https://medium.com/mindorks/11-android-studio-shortcuts-every-android-developer-must-know-a153e736e611

Override Methods(CTRL+O) :去尋找onCreateOptionsMenu(menu)-在WIN上

找到了~

package com.huang.mymenu;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.Menu;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    //建立menu


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        return super.onCreateOptionsMenu(menu);
    }
}

java檔讓menu顯示-右鍵Generate-->Override

Override Methods(CTRL+O) :去尋找 -在WIN上

我按完有點跑掉-這裡用手動調成這樣

package com.huang.mymenu;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    //建立menu

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        return super.onCreateOptionsMenu(menu);
    }

    //menu加偵聽器
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        return super.onOptionsItemSelected(item);
    }


}

在xml產生+在java檔叫出來

建立分析器:menu角色 / 位置

package com.huang.mymenu;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    //建立menu

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater =getMenuInflater();
        inflater.inflate(R.menu.menu_main,menu);

        return true;
    }

    //menu加偵聽器
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        return super.onOptionsItemSelected(item);
    }


}

到這裡模擬器就可以看到了喔~

加偵聽器用switch

//menu加偵聽器
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        
        switch (item.getItemId()){
            case R.id.Item01:
                Toast.makeText(MainActivity.this,"第1層第1項",Toast.LENGTH_SHORT).show();
                break;
        }
        
        
        return super.onOptionsItemSelected(item);
    }

item02 就是讓他直接消失，所以不用

Toast.makeText(MainActivity.this,"第1層第1項",Toast.LENGTH_SHORT).show();

程式碼改成:

case R.id.Item02:
                //Toast.makeText(MainActivity.this,"第1層第1項",Toast.LENGTH_SHORT).show();
                finish();

後面也是依序新增:


package com.huang.mymenu;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    //建立menu

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater =getMenuInflater();
        inflater.inflate(R.menu.menu_main,menu);

        return true;
    }

    //menu加偵聽器
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {

        switch (item.getItemId()){
            case R.id.Item01:
                Toast.makeText(MainActivity.this,"第1層第1項",Toast.LENGTH_SHORT).show();
                break;
            case R.id.Item02:
                //Toast.makeText(MainActivity.this,"第1層第1項",Toast.LENGTH_SHORT).show();
                finish();

            case R.id.Item03:
                Toast.makeText(MainActivity.this,"第1層第3項",Toast.LENGTH_SHORT).show();
                break;

            case R.id.sub01:
                Toast.makeText(MainActivity.this,"第2層第1項",Toast.LENGTH_SHORT).show();
                break;
            case R.id.sub02:
                Toast.makeText(MainActivity.this,"第2層第2項",Toast.LENGTH_SHORT).show();
                break;

        }


        return super.onOptionsItemSelected(item); //賦予功能
    }


}

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

    <item
        android:id="@+id/Item01"
        android:icon="@android:drawable/btn_star_big_on"
        android:title="AA"
        app:showAsAction="always" />
    <item
        android:id="@+id/Item02"
        android:icon="@android:drawable/ic_btn_speak_now"
        android:title="BB"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/Item03"
        android:icon="@android:drawable/ic_dialog_email"
        android:title="CC"
        app:showAsAction="never" />
    <item
        android:id="@+id/Item04"
        android:title="OTHER" >
        <menu >
            <item
                android:id="@+id/sub01"
                android:title="DD01" />
            <item
                android:id="@+id/sub02"
                android:title="DD02" />
        </menu>
    </item>
</menu>

因為是Toast所以也是要用手機模擬

用純java寫出來:

也是開新檔案



import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.SubMenu;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {

        MenuItem item01 = menu.add(0,0,0,"AA");
        MenuItem item02 = menu.add(0,1,1,"BB");
        MenuItem item03 = menu.add(0,2,2,"CC");
        //MenuItem other = menu.add(0,3,3,"OTHER");
        item01.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);

        SubMenu sub = menu.addSubMenu(0,3,3,"OTHER");
        sub.add(0,100, 0, "S1");
        sub.add(0,101, 1, "S2");

        return true;
    }

    //menu加偵聽器
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        switch(item.getItemId()){
            case 0:
                //Toast.makeText(MainActivity.this, "第一層第一項", Toast.LENGTH_SHORT).show();
                finish();
                break;
            case 1:
                Toast.makeText(MainActivity.this, "第一層第一項", Toast.LENGTH_SHORT).show();
                break;
            case 2:
                Toast.makeText(MainActivity.this, "第一層第2項", Toast.LENGTH_SHORT).show();
                break;
            case 100:
                Toast.makeText(MainActivity.this, "第2層第一項", Toast.LENGTH_SHORT).show();
                break;
            case 101:
                Toast.makeText(MainActivity.this, "第2層第2項", Toast.LENGTH_SHORT).show();
                break;
        }

        return super.onOptionsItemSelected(item);
    }
}

因為是Toast所以也是要用手機模擬