학원/ANDROID
01/05 77-1 [Android] FrameLayout
도원결의
2023. 1. 7. 12:37
안드로이드.... 재밌는데
팀플하느라 복습 거의못하고 있음
아쉽....주말에라도 몰아서 정리 해 놔야지...
[FrameLayout]
원래는 1개의 화면은 1개의 activity로 구성이 되는데
1개의activity 에 여러 개 의 화면을 띄우고 싶을 때 사용한다. (사실은 아래서 위로 쌓이는 것임)
둘째날 부터 도구프로그램에 조금 씩 적응해 가는 것 같음!!!
activity_main.xml 에서는 진짜 화면구성하는 공간인거 같고 ! 스프링에서 뷰 단 같은 느낌?
MainActivity.java 에서는 자바코드로 이벤트 입히기!! 요기가 컨트롤러나 서비스 같은 곳 같다!
activity_main(뷰단)부터 구성 상단에 버튼 세 개를 배치할 거
<!--상단 메뉴 배치-->
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Material은 버튼의 background속성이 무시된다
background적용하기 위해서는 테마를 바꾸자
Theme.AppCompat.Light 로(res->values->themes->themes.xml)-->
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="메뉴1"
android:id="@+id/btnMenu1"
android:background="@color/black"
android:textColor="@color/white"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="메뉴2"
android:id="@+id/btnMenu2"
android:background="@color/black"
android:textColor="@color/white"
android:layout_marginLeft="1dp"
android:layout_marginRight="1dp"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="메뉴3"
android:id="@+id/btnMenu3"
android:background="@color/black"
android:textColor="@color/white"
/>
</androidx.appcompat.widget.LinearLayoutCompat>
저렇게 id를 준거는 MainActivity.java 로가서 자바코드로 제어를하기 위한 연결고리라고 생각하면 된다
그리고 배경색 이나 글자색에도 @요게 보이는데 @에 붙어있는 것을
참조하겠다는 표시라고 보면 이해하기 쉽다!
화면구성 : 버튼메뉴에 따른 화면구성 프레임 아웃 배치
첫 번째 화면
프레임레이아웃으로 세번째까지 크게 감싸는거
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/container"
>
<!--1 화면-->
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/frame1"
android:background="#D69292"
android:padding="10dp"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="첫번째 화면입니다"
android:textSize="20sp"
android:gravity="center_horizontal"/>
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*"
android:padding="10dp"
>
<TableRow>
<TextView android:text="아 이 디" android:layout_height="match_parent" android:gravity="center_vertical" android:textSize="18sp" />
<EditText android:id="@+id/user" android:hint="아이디를 입력하세요" android:layout_span="8"/>
</TableRow>
<TableRow>
<TextView android:text="비 밀 번 호" android:layout_height="match_parent" android:gravity="center_vertical" android:textSize="18sp"/>
<EditText android:id="@+id/pass" android:hint="비밀번호를 입력하세요" android:inputType="textPassword" android:layout_span="8"/>
</TableRow>
<TableRow>
<Button android:id="@+id/btnOk" android:text="확인" android:layout_column="7"/>
<Button android:id="@+id/btnCancel" android:text="취소" android:layout_marginLeft="5dp"/>
</TableRow>
</TableLayout>
</androidx.appcompat.widget.LinearLayoutCompat>
두 번째 화면
<!--2 화면-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/frame2"
android:background="#A8e6ab"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="두 번째 화면 입니다."
android:layout_centerInParent="true"
/>
</RelativeLayout>
세 번째 화면
<!--3 화면-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/frame3"
android:background="#81a2e3"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="세 번째 화면 입니다."
android:layout_centerInParent="true"
/>
</RelativeLayout>
</FrameLayout>
</androidx.appcompat.widget.LinearLayoutCompat>
이제 자바코드로 제어 하러 감 MainActivity.java자바스크립트에서 이벤트거는거와 비슷하다크게보면1.위젯 얻기 (=이벤트객체 얻기)
2.리스너 부착(=이벤트 걸기)
요렇게함!
이벤트 거는 방법은 2가지로 정리할 거
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//위젯얻기
Button btnMenu1 = findViewById(R.id.btnMenu1);
Button btnMenu2 = findViewById(R.id.btnMenu2);
Button btnMenu3 = findViewById(R.id.btnMenu3);
FrameLayout container = findViewById(R.id.container);
LinearLayoutCompat frame1= findViewById(R.id.frame1);
RelativeLayout frame2= findViewById(R.id.frame2);
RelativeLayout frame3= findViewById(R.id.frame3);
방법1.: 뷰의 visiviltity 속성 android:visibility="invisible" (화면 보이기/안보이기)
//리스너 부착
btnMenu1.setOnClickListener(v->{
if(frame1.getVisibility()== View.INVISIBLE){
frame1.setVisibility(View.VISIBLE);
}
frame2.setVisibility(View.INVISIBLE);
frame3.setVisibility(View.INVISIBLE);
});
btnMenu3.setOnClickListener(v->{
if(frame3.getVisibility()== View.INVISIBLE){
frame3.setVisibility(View.VISIBLE);
}
frame1.setVisibility(View.INVISIBLE);
frame2.setVisibility(View.INVISIBLE);
});
방법2 : 레이아웃 메소드 이용 (클릭하면 모든 뷰 제거하고 클릭한 화면면 뷰를 부착하는 원리)
//부착된 모든 뷰 제거
container.removeAllViews();
//첫 번째 화면 부착
container.addView(frame1);
//리스너 부착
btnMenu1.setOnClickListener(v->{
container.removeAllViews();
container.addView(frame1);
});
btnMenu2.setOnClickListener(v->{
container.removeAllViews();
container.addView(frame2);
});
btnMenu3.setOnClickListener(v->{
container.removeAllViews();
container.addView(frame3);
});
}
}
안드로이드 하면서 람다식을 드디어! 제대로 사용 해 보는 것 같음
이해가 안됐는데
계속 써보니
꽤 간편하고 좋은 것 같다 !!