(참고사항) - 안드로이드 스튜디오가 아닌 웹에서 Kotlin 코딩하기

--> kotlin 코드를 간단히 시험해보고 싶을 때 사용

kotlin 홈페이지 : https://kotlinlang.org/

[ kotlin 홈페이지의 우측 상단에 play 버튼 클릭 --> playground 선택]

[ 웹에서 kotlin코드를 실행해 볼 수 있게 됨 ]

---

소개

6자리의 로또 번호를 랜덤으로 만드는 앱

드로버블에 대한 공식 설명 : https://developer.android.com/guide/topics/resources/drawable-resource?hl=ko

--> 이중에서 Shape Drawable을 사용할 것임
--> Shape Drawable에 대한 자세한 설명은 02 - 1 글에 있음

---

레이아웃 소개

노란 원의 숫자는 직접 선택한 것, 나머지 숫자는 자동생성으로 생성한 것

---

시작하기에 앞서 알고갈 것들

Random() 함수

[ Random의 생성함수 ]

--> Random함수는 정말로 무작위한 값을 뽑아내는 것이 아니라, 파라미터로 주는 시드값을 가지고 랜덤함수의 연산을 돌려서 나온 값을 리턴한 것이다.

     --> 따라서 Random함수에 같은 시드값을 넣었다면 같은 결과값이 나온다.

--> 따라서 Random함수로 무작위한 값을 뽑아주기 위해서는 시드값을 무작위로 바꿔줄 필요가 있다.

하지만 미리 말하자면ㅡ,

Kotlin에서는 Random()함수에 따로 파라미터를 넣지 않으면 기본값으로 현재 시간의 나노세컨드(대략 1/1000000000초)를 시드값으로 사용한다.

( 즉, 따로 시드값을 넣어줄 필요가 없다 !!!! )

시드값을 무작위로 ??

일반적으로 사용하는 방법은 현재 시간을 시드값으로 하는 것이다.
보통 밀리세컨드 (1/1000초) 이하의 단위를 많이 사용한다.

Random()함수 사용하기

[기본형] --> 말그대로 무작위한 값이 나옴

---

[무작위로 나오는 값의 범위를 지정하고 싶을 때]

예를 들어 ) 0 ~ 44 사이의 무작위 값을 뽑고 싶다면,

이렇게 random.nextInt()의 파라미터로 해당 숫자를 넣어주면 된다.

     nextInt()의 파라미터로 45를 넣으면 0 ~ 44까지의 45개의 숫자중에 무작위로 값이 나온다
     

---

[시드값을 지정했을 때] --> 시드값이 변하지 않는다면 해당 범위내의 고정된 값이 반환됨

---

우리가 사용할 중복되지 않는 1~45사이의 숫자 6개를 뽑는다면?

3개의 조건

• 중복되지 않음
• 1~45
• 6개의 숫자

--> Set의 경우 중복이 불가능한 특징이 있기 때문에 위의 경우 List보다 간결하게 만들어 낼 수 있다.
( Set의 특징을 이용한 코딩 )

[MutableList를 사용할 경우]

--> 빈 mutableList에 값을 하나씩 넣을 것임
--> list에 데이터가 6개 들어가면 종료
--> 만약에 뽑은 숫자가 list안에 이미 있다면 continue를 사용해 while문 처음으로 되돌아감
--> 뽑은 숫자가 list안에 없다면 리스트에 넣고 다시 반복

[MutableSet을 사용할 경우]

--> 빈 mutableSet에 값을 하나씩 넣을 것임
--> Set에 데이터가 6개 들어가면 종료
--> Set은 중복된 값은 그냥 추가하지 않기 때문에 중복에 대한 처리 필요 X

---

Random()을 사용하지 않고 로또 번호 뽑는 코드 만들기

--> mutableList생성 --> apply함수를 사용해서 List의 초기화 진행

--> list.shuffle()을 이용하여 list의 내용을 섞어줌

--> list.subList(0,6)을 이용하여 섞인 list에서 앞의 6개만 남겨줌

---

ConstraintLayout

--> 많이 사용되는 layout
( 그래서 처음 프로젝트를 만들면 ConstraintLayout으로 만들어줌 )

ConstraintLayout 공식 문서 : https://developer.android.com/reference/androidx/constraintlayout/widget/ConstraintLayout

ConstraintLayout이란?

Constaraint의 의미 = 강제, 제약
강제하거나 제약하는 룰을 통해서 레이아웃을 제어할 수 있도록 해주는 레이아웃

ConstraintLayout을 통해 사용할 수 있는 여러가지 제약들

    ConstraintLayout 공식문서에 자세한 내용이 있음

1. Relative positioning

--> 가장 기본적인 제약의 형태

[Relative positioning을 사용할 때의 위치 명칭들]

  left가 start와 같고 right가 end와 같은 이유는 보통 레이아웃이 왼쪽에서 오른쪽으로 그려지기 때문이다. 
  만약 오른쪽에서 왼쪽으로 그려졌다면 반대였을 것이다.
  

[ Relative positioning의 사용 예시 ]

buttonB에 속성으로 제약을 줌
( 제약의 내용 : buttonB의 Left가 buttonA의 Right에 오도록 함 )

Relative position에서 사용되는 속성들

---

2. Margin과 GoneMargin

Margin과 GoneMargin의 차이점을 예시로 설명하자면,
A,B 그리고 B,C 가 각각 30의 margin을 가지고 있다고 할 때

[ margin으로 설정되어 있을 경우 ]
B가 없어지면 ( 즉, B가 gone 상태가 될 경우 ) B의 크기가 0인 것으로 간주하는 것이기 때문에
A,C의 간격이 60으로 나타나게 된다.

[ goneMargin을 설정되어 있을 경우 ]
B가 없어지면, A,C의 간격이 기존의 A,B와 B,C의 간격인 30으로 조정되어 나타나게 된다.

margin에 사용되는 속성들

GoneMargin에 사용되는 속성들

---

3. Centering position 과 bias

[ Centering position ]

컴포넌트에 대해 양쪽( 좌우 혹은 위아래 )에 Relative position을 설정하면 양쪽의 중앙에 해당 컴포넌트가 위치하게 됨

 아래의 그림은 parent의 왼쪽에 컴포넌트의 왼쪽이 붙고ㅡ, 
 parent의 오른쪽에 컴포넌트의 오른쪽이 붙도록 설정하였는데
 이렇게 할 경우ㅡ, 좌우의 중간지점에 컴포넌트가 놓이게 된다.
 
 좀더 나아가자면 bias가 1:1인 상황이다.

[ bias ]

끝까지 나아가는 두 지점에 대해 몇대 몇 지점에 컴포넌트를 놓을지 설정

--> 아래의 경우 좌우로 끝까지 나아가게 되어있고, bias가 0.3이므로
좌우를 3:7의 비율로 나누는 지점에 컴포넌트가 놓이게 된다.

---

4. Circular positioning

---

5. Visibility behavior

컴포넌트가
Gone 상태가 되면
없어진 것으로 인식하는 것이 아닌, 그냥 위젯의 크기가 0인것으로 인식함

---

6. Dimension constrains

ConstraintsLayout에서 컴포넌트의 크기 조정에 대한 영역

• 최소, 최대 크기 지정

  이 것은 컴포넌트의 내용에 따라 컴포넌트의 크기가 유동적으로 정해지는 경우에 사용되므로
  컴포넌트의 크기는 wrap_content로 설정한다.

• 컴포넌트의 크기를 정하는 3가지 종류

1. (a)처럼 크기가 123dp등으로 고정된 경우

2. WRAP_CONTENT로 지정하여 내용에 따라 크기가 유동적으로 정해지게 하는 경우

3. (b)처럼 "0dp" 혹은 MATCH_CONSTRAINT로 설정하여, 가능한 최대 크기로 설정할 경우

--> (c)처럼 0dp로 설정한 후 margin을 줘서 떨어뜨리는 방법도 있다.

--> ConstraintsLayout에서 컴포넌트의 크기를 0dp 혹은 MATCH_CONSTRAINT로 설정하는 것은 다른 Layout에서 Match_Parent로 설정하는 것과 동일한 의미를 지닌다.

또한 ConstraintsLayout에서는 Match_Parent를 사용하지 않는 것이 권장된다.

중요 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!@@@@@@@@@@@@@@@@@@@

ConstraintsLayout에서는 Match_Parent를 사용하지 않는 것이 권장된다.

대신 길이를 "0dp"나 Match_constraint로 설정하면 동일한 효과를 볼 수 있다. ( 아래에 자세한 내용 )

---

7. Chain

ConstraintsLayout에서 컴포넌트들의 위치 관계가 마치 Chain처럼 묶여있는 것을 말한다.

이렇게 묶인 Chain은 첫번째 컴포넌트( head 컴포넌트 )의 속성에 따라 나머지도 따라간다.

head 컴포넌트에선

layout_constraintHorizontal_chainStyle
layout_constraintVertical_chainStyle

이 두 속성을 이용하여 Chain의 Style을 선택할 수 있으며 그 종류는 다음과 같다.