안드로이드 어플리케이션을 만들 때 사용하는 Android Studio를 통해 UI에 대해 공부하는 강의를 들으며, 공부한 내용들을 기록하고자 이렇게 글을 작성한다.
개발 언어는 Java와 Kotlin 중 Java를 채택하여 학습하였다. 아무래도 Java는 사용해 본 적이 있지만, Kotlin은 생소하기에 이를 선택하게 되었다.
생소한 화면
여태까진 써보지 못 했던 화면이 눈 앞에 보였다. Android Studio와 같이 Front 화면과 Back 코드를 바로 작성할 수 있는 것은 처음이였다.
여태까진 Visual Studio, Visual Studio Code 등 코드 작성만 하는 소프트웨어만 사용했었는데 상당히 신기한 경험을 주었다.
우선 안드로이드 어플리케이션의 개발은 처음이었으므로 다양한 용어들에 대해서 숙지할 필요가 있었다.
기본적인 용어
Activity(= 액티비티): 안드로이드 응용 프로그램의 화면 구성 단위, 가장 먼저 생성되고 나타나는MainActivity(메인 액티비티) 로 부른다.Resource(= 리소스): 프로그램을 만들기 위해 필요한 자원, 리소스는 xml로 정의하여 관리하고 사용한다.Layout(= 레이아웃): 액티비티 화면을 구성하고 배치하는 방법View(= 뷰): 사용자인터페이스(User Interface, UI)를 구성하는 컴포넌트(= 위젯). 뷰 여러개를 모아두면 뷰 그룹이라고 부른다.
처음이니만큼 엄청 간단한 부분만 수행 해 보았다.
activity_main.xml이란
activity_main.xml은 메인 액티비티 화면을 구성하는 레이아웃 리소스를 의미한다.
위의 화면처럼 activity_main.xml은 디자인의 형태로 접근 할 수도 있고 코드의 형태로도 접근할 수 있었다. 디자인과 코드를 넘나들 수 있다는 점이 상당히 장점이라고 느껴졌었다.
화면을 보면 TextView라는 뷰를 넣어둔 화면을 볼 수 있다. 이번에는 이 TextView를 가지고 간단한 기능들을 확인해 볼 생각이다.
코드를 담당하는 MainActivity.java 파일
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}기본적으로 안드로이드 스튜디오의 새 파일을 열면 위와 같이 코드가 작성된다. MainActivity클래스가 생성되면서 자동으로 onCreate 콜백 메소드가 생성되는 것을 볼 수 있었다.
이제 여기서 TextView를 조작하는 것을 해 볼 것이다.
TextView를 xml에서 조작하는 방법
그 전에 우선 xml 상에서 TextView에 나타나는 값을 수정하는 방법을 한 번 알아보고 넘어가자. TextView를 클릭하면 아래와 같이 화면이 나타난다.
여기서 우측의 Common Attributes를 보면 text라는 속성이 있고 여기에 @string/univ라는 값을 넣은 것을 볼 수 있다.
이 값이 의미하는 것은 string이라는 리소스 모음에 있는 univ 리소스를 가져와 사용한다는 의미라고 간단히 생각하면 될 것 같다.
text의 위치에는 위와 같은 경로 표시 말고도 바로 문자를 작성해서 값을 추가할 수도 있다.
상세한 것은 이후에 다루어 보도록 하고, 여기서는 xml상에서 TextView의 값을 바꿀 수 있다는 정도만 인지하고 넘어가자.
TextView를 자바 코드에서 수정하는 방법
TextView의 값 수정
이번에 할 것 중 가장 핵심은 자바 코드에서 TextView를 수정하는 것이다.
아래 두 가지를 바꾸어 수정을 진행 할 것이다
- TextView에서 띄워주는 Text의 변경
- TextView에 뜨는 글자의 색상 변경
우선 TextView를 자바 코드에서 수정하려면 TextView를 제어할 객체가 필요하다. 객체생성은 콜백메소드 문장 이전에 수행한다.
public class MainActivity extends AppCompatActivity {
//컴포넌트의 객체참조변수 정의하고 이를 이용해 컴포넌트를 관리
TextView txtDisplay1; //변수선언과 같이 txtdisplay 객체참조변수 생성
...TextView txtDisplay1은 여기서 객체참조 변수의 역할로 textView1 컴포넌트를 제어하도록 돕는 역할을 할 것이다.
이를 만든 이유는 xml 리소스를 자바 코드에서 수정하기 위해선 xml에서 만들어지는 컴포넌트(텍스트뷰, 버튼 등..)의 ID를 가져와 객체참조변수에 할당해야 이에 대한 제어가 가능하기 때문이다.
TextView를 코드에서 사용하기 위해서는 반드시 사용할 컴포넌트에 대한 캐스팅(형변환)이 필요하다
txtDisplay1 = (TextView)findViewById(R.id.textView1);
//txtDisplay1 변수에 id를 이용해 뷰를 찾아 연결
//id를 사용하려면 형변환을 수행해야 함
txtDisplay1.setText("컴퓨터공학"); //지정한 문자열을 텍스트뷰에 표시위 코드와 같이 작성하게 된다면 앞서 선언한 txtDisplay1 객체참조 변수에 TextView타입의 textView1의 식별번호(ID)를 부여한다.
그리고 txtDisplay1이 가진 ID의 text를 변경하는 기능을 가진다.
이것이 자바 코드에서 xml의 컴포넌트인 TextView의 값을 수정하는 방법이다.
TextView의 값이 가지는 색상의 수정
값을 수정하는 것을 해 보았으니 이번에는 수정된 값에 색깔을 바꾸어 볼 것이다.
위에서 사용된 코드 중
txtDisplay1 = (TextView)findViewById(R.id.textView1);
까지는 그대로 사용한다.
여기서 색상을 변경하기 위해 안드로이드에서 제공하는 기본 색상 리소스인 Color 객체를 활용할 것이다.
Color 객체를 사용하여 빨간색으로 바꾸는 코드는
txtDisplay1.setTextColor(Color.RED); 이다.
물론 색상의 변경이 꼭 미리 준비된 색상으로만 가능한 것은 아니고 임의로 리소스에 색상을 준비하거나 하는 방식으로 다른 색상을 부여할 수도 있다.
마무리
이번에는 처음이다 보니 간단하게 글을 마무리하고자 한다.
어플리케이션을 만든다는 것이 생소한 본인에게는 천천히 나아가는 것이 이해에 더 도움이 될 것으로 보여 차근차근 공부 해 볼 생각이다.
처음 사용한 Android Studio였지만, 사용에 있어서 불편한 점은 크게 느끼지 못해 만족스럽다. 디자인을 직접 보면서 배치할 수도 있고, 코드로 변환해 볼 수도 있다는 점이 가장 장점이 아닐까 싶다.
다음 시간에는 이번보단 조금 더 다른 기능들을 응용해보겠다.
