Java로 인형 앱을위한 "Look"을 만드는 법 - 인형

Android 앱 개발의 일반적인 지침은 논리와 표현을 구분하는 방법을 알려줍니다. 덜 전문적인 용어로,이 가이드 라인은 앱이하는 일을 앱이 어떻게 보이는지 혼동하지 않도록 경고합니다. 이 지침은 삶의 여러 측면에 적용됩니다. 예를 들어, 웹 사이트를 디자인하는 경우 아티스트에게 레이아웃을 수행하고 괴짜에게 코딩을 수행하게하십시오. 보고서를 작성하는 경우 먼저 아이디어를 작성하십시오. 나중에 글꼴 및 단락 스타일에 대해 걱정할 수 있습니다.

앱 개발에 관한 자료는 양식을 기능과 분리하는 데 도움이되는 구체적인 기술과 프레임 워크를 설명합니다.

앱에 버튼, 상자 및 기타 기능을 추가하려면 다음을 수행하십시오.

1. Android Studio를 시작하고 새 프로젝트를 시작하십시오. 이 단계를 완료하면 비어있는 활동이있는 새로운 프로젝트가 생깁니다. 프로젝트가 Android Studio의 기본 창에 표시됩니다.
2. 새 프로젝트의 app / res / layout 브랜치 (기본 창의 프로젝트 도구 창에 있음)에서 activity_main을 두 번 클릭하십시오. xml . 결과적으로 Android Studio의 Designer 도구는 activity_main의 내용을 표시합니다. xml . Designer 도구에는 두 가지 모드가 있습니다. 드래그 앤 드롭 비주얼 편집을위한 디자인 모드와 XML 코드 편집을위한 텍스트 모드입니다. 디자이너 도구의 맨 아래에는 디자인 탭과 텍스트 탭이라는 두 개의 탭이 있습니다.
3. 디자인 탭을 클릭합니다.

   

   디자인 모드에서 팔레트, 구성 요소 트리, 두 개의 미리보기 화면 및 속성 창을 볼 수 있습니다.

   팔레트가 보이지 않으면 디자이너 도구의 왼쪽 가장자리에있는 작은 팔레트 버튼을 찾으십시오. 해당 버튼을 클릭하면 팔레트가 나타납니다.

   컴포넌트 트리에는 TextView - "Hello World! " 이 브랜치는 Hello World! 텍스트를 나타냅니다. 는 앱의 일부로 자동으로 표시됩니다. 이 텍스트는 앱에 필요하지 않습니다.

4. 구성 요소 트리에서 TextView - "Hello World!" 브랜치를 선택한 다음 Delete 키를 누릅니다. "Hello World" 브랜치가 컴포넌트 트리에서 사라지고 Hello World! 가 미리보기 화면에서 사라집니다.

   다음 단계에서는 앱을 만드는 과정을 안내합니다.

   

   앱의 레이아웃에는 세 가지 종류의 구성 요소가 있으며 각 구성 요소에는 여러 가지 다른 이름이 사용됩니다. 다음 세 가지 구성 요소가 있습니다.
   • EditText (일반 텍스트라고도 함): 사용자가 한 줄의 텍스트를 편집 할 수있는 곳입니다. 이러한 종류의 구성 요소에 대한 일반적인 이름은 텍스트 필드 입니다.
   • 버튼 : 버튼은 버튼입니다. 버튼을 클릭 하시겠습니까? 바로 가서 클릭하십시오.
   • TextView (일반 텍스트보기, 큰 텍스트, 보통 텍스트 등): 앱이 텍스트를 표시하는 곳입니다. 일반적으로 사용자는 TextView 구성 요소에서 텍스트를 편집하지 않습니다.

     안드로이드의 EditText , Button 및 TextView 구성 요소는 매우 다른 구성 요소가 아닙니다. 모든 EditText 구성 요소는 일종의 TextView 이며 모든 Button 도 일종의 TextView 입니다. 객체 지향 프로그래밍 언어에서 EditText 클래스는 TextView 클래스를 확장합니다. Button 클래스는 또한 TextView 클래스를 확장합니다.

5. 일반 텍스트 (즉, EditText ) 항목을 팔레트의 위젯 그룹에서 미리보기 화면 중 하나로 드래그하십시오. 일반 텍스트 항목은 추한 곳에서 볼 수 있습니다. 괜찮아. 당신은 예술 작품을 만들지 않습니다. 자바 코드를 작성하는 법을 배우고 있습니다.
6. 5 단계를 반복하여 이번에는 미리보기 화면에 Button 항목을 넣습니다. Button 구성 요소를 일반 텍스트 (EditText) 구성 요소 아래에 배치합니다. 나중에 Button 구성 요소를 넣는 위치가 마음에 들지 않으면 미리보기 화면의 다른 곳으로 드래그하여 쉽게 이동할 수 있습니다.
7. 6 단계를 반복하여 이번에는 TextView 구성 요소를 미리보기 화면에 놓습니다. TextView 구성 요소를 Button 구성 요소 아래에 놓으십시오.하지만 다시 한 번 생각해보십시오.

   나머지 단계에서는 각 구성 요소에 나타나는 텍스트를 변경합니다.

8. 미리보기 화면이나 구성 요소 트리에서 버튼 구성 요소를 선택합니다. 결과적으로 디자이너 도구의 속성 창에 Button 구성 요소의 일부 속성이 표시됩니다.

   

   Button 구성 요소를 선택하면 속성 창에 TextView 라는 단어가 표시됩니다. 이것을 7 단계에서 팔레트에서 드래그 한 TextView 구성 요소와 혼동하지 마십시오. 단추를 선택한 상태에서 속성 창에있는 모든 필드는 Button 구성 요소를 참조합니다. 속성 창에 TextView 라는 단어가 나타나면 4 단계의 기술 자료 아이콘을 참조하십시오. TextView 라는 단어가 사용자를 혼동하지 않으면 기술 자료 아이콘을 읽지 마십시오!)
9. 속성 창의 텍스트 라는 필드에 COPY라는 단어를 입력하십시오. 그렇게하면 COPY 라는 단어가 Button 구성 요소의면에 나타납니다. WYSIWYG 미리보기 화면에서이를 확인할 수 있습니다.

   속성 창에서 텍스트 라는 두 개의 필드를 볼 수 있습니다. 그렇다면 하나는 테스트 용이고 다른 하나는 앱을 실행하기위한 것입니다. 확실하지 않은 경우 두 필드 모두에 COPY 라는 단어를 입력해도 문제가되지 않습니다.

10. 활동의 EditText 및 TextView 구성 요소로 단계 8과 9를 반복하지만 이번에는 COPY 라는 단어를 해당 구성 요소에 넣지 마십시오. 대신 이러한 구성 요소에서 문자를 제거하십시오.작업이 끝나면 미리보기 화면이 아래의 화면과 유사하게 나타납니다. 미리보기 화면이 이와 똑같지 않으면 걱정하지 마십시오. 구성 요소가 미리보기 화면의 다른 위치에 흩어져 있거나 Android Studio 제작자가 미리보기 화면의 모양을 변경했을 수 있습니다. EditText 구성 요소, Button 구성 요소 및 TextView 구성 요소가있는 한 괜찮습니다.
11. 지금까지의 작업을 저장하려면 파일 → 모두 저장을 선택하십시오.