-to do list-
1. 네비게이션 메뉴 바 만들기 이해하기
2. 레이아웃 강의
3. 애플리케이션 화면 디자인
4. 액티비티 화면 전환
- 네비게이션 메뉴 바 만들기
1. Navigation Drawer Activity 이해
새 프로젝트 만드는 과정에서 navigation activity 코드를 보며 이해하고 구현해보았다.
(1) navigation header 부분 내용 바꾸기
value 폴더 안에 있는 string.xml에서 원하는 값의 데이터를 바꾸고 navigation headerd에 적용하면 된다.
(2) navigation header에 개인사진 첨부하기
drawable 폴더 안에 원하는 이미지를 넣고 string.xml에서 넣은 이미지로 링크를 변경해주면 된다.
string.xml쪽 코드 변형을 통해 layout부분의 내용을 바꿀 수 있는 것 같다...!!
2. button navigation bar 구현하기
아래 강의를 보고 버튼을 이용해 네비게이션 메뉴를 선택할 수 있게 구현해보았다.
https://www.youtube.com/watch?v=stwCk_f3sCw
buil.gradle에 영상에서 나온 링크를 추가해 bottomnavigation을 구현하게끔 코드를 짰고, drawable에 vector asset을 통해 안드로이드 기본 아이콘을 추가했다.
menu에 추가한 아이콘들의 값들을 입력해주었고 layout에 네비게이션바의 아이콘을 누르면 이동될 fragment들을 만들어주었다.
javaclass파일에서 oncreateView쪽을 작성하다 오류가 났는데,org부분을 고침으로써 해결하였다.
그후 MainActivity 자바 파일에서
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bottomNavigationView = findViewById(R.id.bottomNavi);
bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
switch (menuItem.getItemId()) {
case R.id.action_man:
setFrag(0);
break;
case R.id.action_bedtime:
setFrag(1);
break;
case R.id.action_bluetooth:
setFrag(2);
break;
case R.id.action_call:
setFrag(3);
break;
case R.id.action_run:
setFrag(4);
break;
}
return true;
}
});
frag1 = new Frag1();
frag2 = new Frag2();
frag3 = new Frag3();
frag4 = new Frag4();
frag5 = new Frag5();
setFrag(0); // 첫 프래그먼트화면 지정
}
// 프래그먼트 교체가 일어나는 실행문
private void setFrag(int n) {
fm = getSupportFragmentManager();
ft = fm.beginTransaction();
switch (n){
case 0 :
ft.replace(R.id.main_frame,frag1);
ft.commit();
break;
case 1:
ft.replace(R.id.main_frame,frag2);
ft.commit();
break;
case 2:
ft.replace(R.id.main_frame,frag3);
ft.commit();
break;
case 3:
ft.replace(R.id.main_frame,frag4);
ft.commit();
break;
case 4:
ft.replace(R.id.main_frame,frag5);
ft.commit();
break;
}
}
}
이와 같이 구현했는데 fragment를 불러오기 위해 fragmentmaneger를 사용했고 fragmentTransaction으로 정보를 이용할 수 있다.
- 레이아웃 강의
일단 레이아웃의 종류는 총 5가지가 있다.
(1) Linear Layout
https://www.youtube.com/watch?v=IfiihlUV0LI
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal>
</LinearLayout>
위의 코드를 통해 레이아웃 안의 첫번째 코드로 화면에 꽉 차게끔 레이아웃을 조정할 수 있고 두번째 코드로 요소 가장자리 크기에 맞출 수 있고 3번째 코드는 레이아웃의 위치를 조정할 수 있었다.
(2) Relative Layout
https://www.youtube.com/watch?v=7IdgPQLI5Lo
Linear Layout과 다르게 스택이 쌓이는 느낌이 아니라 RelativeLayout 안에서 마음껏 코딩해도 무관했다!
<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=".MainActivity">
<TextView
android:id="@+id/tv_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:textColor="32567FF"
android:text="하이하이"/>
</RelativeLayout>
android:id를 통해 텍스트에 아이디 부여가능
너비,높이도 조정가능
글자사이즈는 sp단위로 조정가능
글자색은 FF로 조정가능
여러 텍스트뷰가 존재하면 텍스트뷰끼리 상대적인 위치도 조정가능
(3) Constraint Layout
https://www.youtube.com/watch?v=2zBgR3toNwI
알고 보니 첫번째 스터디 시간에 체인으로 텍스트뷰가 연결되는 것이 바로 contraintlayout 성질이었다.
design에서 constraint widget부분을 건드려 코딩을 직접하는것이 아닌 design을 보고 직접 움직일 수도 있음을 깨달았다.
- 애플리케이션 화면 디자인
다음강의를 보고 compile부분에서 오류가 생겼는지 실행이 안된다.
- 액티비티 화면 전환
'study & bootcamp > 안드로이드 앱 스터디' 카테고리의 다른 글
Android App 개발 스터디 #13 Fragment편 (0) | 2021.08.03 |
---|---|
Android App 개발 스터디 #10 Navigation Menu 커스텀 편 (0) | 2021.07.21 |
Android App 개발 스터디 #9 WebView (0) | 2021.07.21 |
Android App 개발 스터디 #8 SharedPreferences (0) | 2021.07.20 |
Android App 개발 스터디 2주차 todolist-1 (0) | 2021.07.20 |