Notepad

Android

[Android/Kotlin] Floating Button Animation

1. 요약 이번 글에서는 Floting Button Animation을 구현하는 방법에 관하여 알아본다. 구성은 4개의 Floating Button을 사용하며, 처음에는 1개의 Floating Button만이 보이며 이를 Click 하였을 때 숨겨져 있던 나머지 3개의 Floating Button이 나타나 사용할 수 있도록 하였다. 이때, Floating Button은 이동하는 Animation 뿐만 아니라 실제로 숨겨져 있는 Floating Button이 이동(Translation)되어야만 사용이 가능하므로 ObjectAnimator를 사용하였다. 2. 레이아웃 2-1. activity_main.xml 메인 레이아웃으로서 Floating Button 4개를 사용하여 구성하였다. Layout으로는 Rel..

Android/TIP

[Android/Kotlin/Tip] 테두리(border) 그리기 - add a border to the top and bottom

1. 설명 이번 글에서는 Border(테두리)를 추가하는 방법에 관하여 기술한다. 단, 그중에서 Border를 생성할 때 위쪽 방향이 없도록 만들거나 아래 한 방향만 Border를 추가하는 방법을 알아본다. 기존에 모든 Border를 추가하거나 Style Custom 하는 방법에 관해서는 아래 이전에 작성한 글을 참조하면 될 것 같다. [TIP] Android Style Background 꾸미기 - 테두리, 모서리 둥글게 등 Android Background 꾸미기 - 테두리(border) 굵기 지정 및 색 변경, 모서리 (corner) 둥글게 지정 /res/drawable 서 리소스 파일 생성 후 작성 # shape의 shape 속성으.. notepad96.tistory.com activity_mai..

Android

[Android/Kotlin] RecyclerView Duplication - 중첩(이중) 리사이클러뷰

1. 요약 이번 글에서는 중첩(이중) RecyclerView를 구현하는 방법에 관하여 알아본다. 이중 RecyclerView 같은 경우에는 여러 애플리케이션들한테 볼 수 있듯이 자주 사용하는 구성이며 분류에 따라 데이터들을 나눠서 보여줘야 하는 경우 유용하게 사용이 가능하다. 2. 레이아웃 2-1. activity_main.xml 메인 레이아웃으로서 중첩되는 RecyclerView 중 우선 바깥쪽에 RecyclerView를 정의한다. 2-2. item_list_01.xml 메인 레이아웃에서 정의하였던 바깥쪽 RecyclerView에 항목 레이아웃으로서 레이아웃 구성을 보면 RecyclerView가 들어가 있다. 이 RecyclerView서 마찬가지로 레이아웃과 어댑터를 구성하여 RecyclerView를 ..

Android/TIP

[Android/Kotlin/Tip] Layout Line divider (dotted, vertical)

1. 설명 이번 글에서는 Layout Divider 레이아웃 구분선을 만드는 방법들에 관하여 기술한다. Divider을 사용하면 직관적으로 레이아웃을 구분하여 볼 수 있도록 할 수 있으며, 디자인적인 요소로도 활용이 가능하다. activity_main.xml ● Num 1 가로 화면을 가득 채우는 가장 기본적으로 사용할 수 있는 구분선(Divider)이다. View 오브젝트를 사용하여 지정하고자 하는 두께만큼 높이를 지정한 후 Background로 원하는 선의 Color를 줌으로써 원하는 두께와 Color를 갖는 Divider을 만들어 낼 수 있다. ● Num 2 1번에서 구현하였던 Divider과 유사하다. 다만 길이와 Margin 값을 조절함으로써 텍스트 길이만큼의 Divider의 길이를 조절하였고 ..

Android/TIP

[Android/Kotlin/Tip] Floating Button Style Custom

1. 설명 이번 글에서는 Floating Button의 Style을 Custom 하여 다양한 형태의 Floating Button을 디자인하는 방법에 관하여 기술한다. 해당 예시에서는 기존 Floating Button은 타원 형태였다면 사각형 형태이거나, 텍스트를 포함하는 Floating Button와 같이 다른 형태의 스타일로 구성하였다. activity_main.xml 4개의 Floating Button을 각각 다른 스타일을 적용하여 레이아웃을 구성하였다. ● Num 1 backgroundTint : Floating Button Background Color 지정 src : 이미지 지정 borderWidth : border. 테두리의 width(두께)를 지정 shapeAppearanceOverlay: ..

Android

[Android/Kotlin] RecyclerView Expandable - 확장되는 리스트

1. 요약 이번 글에서는 RecyclerView와 Expandable Layout을 활용하여 확장이 되는 리스트를 구현하는 방법에 관하여 기술한다. 해당 예시에서는 확장되는 레이아웃의 데이터를 TextView들을 추가하는 식으로 간단하게 구현하였으며 여기서 사용할 데이터나, 레이아웃이 더욱 복잡해질 경우 이중(중첩) RecyclerView를 사용할 수도 있다. 2. 레이아웃 2-1. activity_main.xml 메인 레이아웃으로서 RecyclerView 1개로 구성하였다. 여기서 부모 레이아웃으로서 NestedScrollView를 사용하였는데 이는 리스트의 항목들이 확장되어 화면이 넘어가버려도 자연스럽게 나타나게 만들기 위해서이다. 2-2. item_list.xml 리스트 항목을 나타내는 레이아웃이다..

Android

[Android/Kotlin] Expandable Layout - 레이아웃 확장하기

1. 요약 이번 글에서는 확장(Expandable)하여 레이아웃을 나타낼 수 있는 방법에 관하여 작성한다. 처음에는 확장되어 보이는 레이아웃은 Visibility하지 않는 상태에서 Layout을 클릭하였을 시 보이지 않던 레이아웃을 보이게 하는 방식으로 구현하였다. 2. 레이아웃 2-1. activity_main.xml 메인 레이아웃 파일로서 아래 이미지처럼 Layout 01과 Layout 02이 나타난다. 이후 각 Layout 01, 02를 클릭하였을 때 아래 숨겨져 있던 Layout이 보이도록 만듦으로써 마치 "접은 글"처럼 레이아웃이 확장되어 나타나지는 기능을 구현한다. ※ 최상단의 LinearLayout을 보면 "android:animateLayoutChanges" 속성을 주고 있다. 이는 레이아..

Android/TIP

[Android/Kotlin/Tip] CardView - 레이아웃 테두리 선, 모서리 둥글게

1. 설명 이번 글에서는 CardView를 사용하여 레이아웃을 디자인하는 방법에 관하여 알아본다. CardView를 사용하면 정의되어 있는 속성으로 쉽게 테두리의 굵기와 색을 입힐 수 있으며 모서리를 둥글게 하는 것도 가능하다. 이외에도 그림자를 주어 Card형의 레이아웃 디자인이 가능하다. activity_main.xml ● strokeWidth : 테두리의 두께를 지정 ● strokeColor : 테두리의 Color를 지정 ● cardCornerRadius : 모서리의 둥근 정도를 지정한다. 지정한 값의 정도에 따라서 예시의 2번째 Card처럼 타원형으로 만들 수도 있다. ● cardBackgroundColor : CardView의 Background Color 지정 ● contentPadding :..