Android Studio Material Design 그외 1 (Floating Action Button, SnackBar, CoordinatorLayout)

◎Material Design : Gogle 디자인 가이드 라인

①Navigation Drawer

②Toolbar

③AppBar Layout, TabLayout

④Floating Action Button

SnackBar - Toast와 비슷하지만 업그레이드 된거라 생각하면 됨.

CoordinatorLayout  - 이 레이아웃을 사용하지 않으면, 밑에서 스택바가 올라왔을때, (+)를 가린다. 

 

<실행 화면>

activity_main.xml 코드

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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">
<!--    corrdinatorLaouy으로 바꿈 - -->
<!--    material이기에 project structure  해야함.-->
    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right|bottom"
        android:layout_margin="16dp"
        android:backgroundTint="@color/colorPrimary"
        app:rippleColor="@color/colorAccent"
        app:fabSize="auto"
        android:src="@android:drawable/ic_input_add"
        android:onClick="clickfab"
        />
 
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="show snackbar"
            android:layout_gravity="center"
            android:onClick="clickbtn"
            />
<!--    relative를 제외한 나머지 view들을 align이 없어서 gravirit로 이동-->
 
<!--    스낵바가 놓여질 위치의 기준 뷰-->
    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:id="@+id/layout_snackbar_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginBottom="88dp"
        android:layout_marginLeft="40dp"
        android:layout_marginRight="40dp"
        >
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
 
    
<!--    backgroundTint로 사용한다. -->
<!--    fab는 float action button의 줄인말-->
</androidx.coordinatorlayout.widget.CoordinatorLayout>

MainActivity.java 코드

package com.tistory.firewallgogo.ex50fab;
 
import androidx.appcompat.app.AppCompatActivity;
import androidx.coordinatorlayout.widget.CoordinatorLayout;
 
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;
 
import com.google.android.material.snackbar.Snackbar;
 
public class MainActivity extends AppCompatActivity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
    }
 
    //다이얼로그보다 편한 다이얼로그 같은 느낌.
    public void clickfab(View view) {
        //Toast말고 다른걸로 하기
        Snackbar snackbar = Snackbar.make(view,"this is a snackbar",Snackbar.LENGTH_INDEFINITE);
        snackbar.setAction("Submit", new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this,"click submit",Toast.LENGTH_SHORT).show();
            }
        });
        snackbar.show();
 
    }
 
    public void clickbtn(View view) {
        //스낵바가 나타나는 위치를 지정하기
        CoordinatorLayout coordinatorLayout =findViewById(R.id.layout_snackbar_container);
        Snackbar snackbar = Snackbar.make(coordinatorLayout,"this is a snackbar", Snackbar.LENGTH_INDEFINITE);
 
        snackbar.setAction("OK", new View.OnClickListener() {
            @Override
            public void onClick(View view) {
 
            }
        });
        snackbar.show();
    }
}