What's New in Android Studio UI Design and Debugging Tools (Google I/O'19)

[음악 재생] VADIM CAEN : 안녕하세요 우리 이야기에 일찍와 주셔서 감사합니다

Android Studio, UI 디자인 및 디버깅의 새로운 기능 도구 고맙습니다 [박수 갈채] 저는 Vadim입니다 Android Studio에서 디자인 툴을 작업합니다 JEROME GAILLARD : 저는 Android Studio 팀의 Jerome입니다

JOE BAKER-MALONE : 저는 Android Studio 팀의 Joe입니다 ASHLEY ROSE : 저는 Android 프레임 워크와 JetPack의 Ashley입니다 VADIM CAEN : 좋습니다 시작하기 전에 모바일 제품에 대해 약간의 이야기를합니다 어제 어쩌면 Android Studio 팀은 개선을 위해 모바일 제품에 중점을 두었습니다

Android Studio의 엔드 투 엔드 사용자 경험 Android Studio 개선은 수정 사항 만이 아닙니다 또한 사용 방법을 개선하는 방법이기도합니다 우리가 확인한 틈새를 채우십시오 우리의 도구 체인은 – 설계 할 때 – 새로운 레이아웃을 구축하고 새로운 탐색 기능을 구축합니다 이 레이아웃 사이에, 당신의 자원을 관리하고, 장치에서 런타임에 검사를 처리합니다

이 도구 체인을 사용하려면 전형적인 사용자 여행을 거치면서, Google Trips 애플리케이션을 구축하십시오 그리고 Jerome은 Layout Editor에 대해 이야기 할 것입니다 여기에서 볼 수있는 첫 번째 레이아웃을 작성하는 방법에 대해 설명합니다 제롬 가이 야드 : 감사합니다, 바딤 그래서 우선, 우리는 Google Trips 앱의 첫 화면, 레이아웃 편집기를 사용하여

레이아웃 편집기를 열면 이것은 화면의 종류입니다 너는 볼거야 여기는 단지 빈 레이아웃 일뿐입니다 우리가 할 첫 번째 일은 청사진 모드로 전환하는 것입니다 속도가 빠르면 빠르며 방금 만들려고 할 때 산만해진다

레이아웃상의 제약 넌 그냥보고 싶지 않아 구성 요소가 실제로 어떻게 보이는지 나는 팔레트에서 – 레이아웃에 필요한 모든 구성 요소를 드래그하여 어느 정도 확실한 곳에서 일단 내가 끝내면 그 시간이 온다

제약 조건을 만들 수 있습니다 좀 더 효율적인 건물 제약이되는 방법으로, 나는 그들을 하나 하나 만들 수 있었다 하지만 문맥 메뉴를 사용하면 한 번에 여러 가지 제약 조건을 만들 수 있습니다 예를 들어 여기서는 RecyclerView를 중앙에 배치하려고합니다 레이아웃 내에서

내가 할 수있는 한 가지는 RecyclerView를 마우스 오른쪽 버튼으로 클릭하는 것입니다 문맥 메뉴에는 옵션이 있습니다 수평으로 센터링의 그것이하는 일은 왼쪽 클릭 한 번으로 오른쪽 제약 조건을 RecyclerView가 중앙에 배치되도록합니다 일단 모든 제약 조건을 다 만들면, 이것은 내 레이아웃이 청사진 모드에서 보이는 것과 같습니다

분명히, 그것은 나에게 정말로 말하지 않는다 디자인에 비해 옳은 것을 만들면 지금 당장 나는 주어진다 이제 디자인 모드로 돌아가겠습니다 그것이 어떻게 생겼는지 보아라 디자인 모드에서는 보이지 않는 것을 볼 수 있습니다

내가받은 원래 디자인과 매우 흡사하다 그 이유는 RecyclerView 뷰 꽤 비어 있습니다 아시다시피, RecyclerView는 일반적으로 런타임에 데이터를 채우고, 하지만 그때는별로 도움이되지 않습니다 레이아웃을 만들고 데이터가 올바르게 표시되는지 확인하십시오 당신이 보게 될 것입니다

이 문제를 해결하려면 디자인 [? 도구?] 속성을 사용합니다 그래서 디자인 시간 속성, 당신은 간단하게 – RecyclerView에서 컨텍스트 메뉴를 다시 사용하십시오 샘플 데이터 선택기 등을 사용할 수 있습니다 샘플 데이터 선택 도구에서 미리 정의 된 템플릿 중 하나를 선택할 수 있습니다 RecyclerView 항목에 대해 귀하가 제공하는 정보

여기에서 첫 번째 이메일 클라이언트를 선택했습니다 그렇게하면 해당 RecyclerView에 대한 레이아웃이 생성됩니다 항목, 이메일 클라이언트 카드 그리고 동시에, 그것을 당신의 RecyclerView에 연결합니다, 그러면 레이아웃 편집기에 채워진 상태로 표시됩니다 물론 우리는 이메일 클라이언트를 구축하지 않습니다

RecyclerView에서 빌드하고자하는 것 그 여행 카드입니다 그래서 나는 그 RecyclerView 아이템을 편집하려고합니다 Trip 카드로 만들었습니다 자원 관리자 패널에서 – 여기에서 볼 수있는 왼쪽 편에, 바딤이 선물 할거야 너에게 훨씬 더 자세하게 – 간단히 말해서 RecyclerView 항목의 이름을 뭔가로 바꿀 수 있습니다

내 프로젝트에 더 적합한, 그리고 나 편집을 시작할 수 있습니다 리소스 관리자에서 레이아웃을 두 번 클릭하십시오 레이아웃 편집기에서 레이아웃을 열면됩니다 화면에서 볼 수 있듯이, 나는 꽤 많이 가지고있다 내 오른쪽 여행 카드에 필요한 모든 권리가있는 구성 요소, ImageView, 몇 개의 태그보기, 그러나 그들은 분명히 올바른 제약 조건을 가지고 있지 않습니다

그래서 모든 제약 조건을 삭제하고, 툴바에서 해당 버튼을 클릭합니다 그 작업이 끝나면, 나는 재구성 만 할 것입니다 모든 제약 한 가지 문제는 우리가 꽤 많은 구성 요소를 가지고 있다는 것입니다 작은 영역에서 서로 겹치기

그것은 약간 어수선 할 수 있습니다 그리고 우리는이 상황에서, 건물 제약 조건은 약간 어려울 수 있습니다 제약 조건을 드래그하는 것이 때로는 어려울 수 있습니다 올바른 대상, 올바른 구성 요소, 특히 구성 요소가 겹치는 경우 이제 우리가 할 수있는 일은 제약을 원하는 곳으로 직접 드래그합니다 연결하려는 구성 요소에서, 그런 다음 팝업 메뉴가 열리고 어떤 유형인지 묻습니다 설정할 제약 조건을 선택하십시오

정말 흥미로워 지네 제약 조건을 다음 위치로 드래그합니다 겹치는 구성 요소가 있습니다 그 상황에서, 우리는 여러 유형의 제약 조건을 사용할 수 있지만 겹치는 구성 요소를 선택하십시오 그 제약 조건을 첨부하고 싶습니다

그리고 그것은 그것을 훨씬 쉽게 만들어야합니다 경우에 제약 조건 레이아웃을 작성하는 방법 중첩되고 작은 구성 요소가있는 곳 도움이 될 수있는 마지막 방법 제약 조건을 효율적으로 만들 수 있습니다 구성 요소를 사용 중입니다 구성 요소에서 여러 구성 요소를 선택하는 경우 – 여기에서는 두 가지 텍스트보기를 선택했습니다

다시 컨텍스트 메뉴에서 마우스 오른쪽 버튼을 클릭하고 선택합니다 사용할 수있는 제약 조건 중 하나 당신은 하나의 제약 조건을 만들 수 있습니다 선택한 여러 구성 요소에 적용됩니다 그래서 여기에서 두 가지 제약 조건을 만듭니다 이 두 텍스트보기에서 동시에 우리가 모든 제약 조건을 다 만들면, 우리의 견해를 조금이라도 사용자 정의 할 때입니다

이를 위해 우리는 Attributes Panel을 사용할 것입니다 레이아웃 편집기의 오른쪽에 있습니다 우리는 Attributes 패널을 재 설계했습니다 Declared Attributes라는 맨 위에 새 섹션을 표시합니다 이 섹션에서는 모든 속성 구체적으로 설정된 선택한보기에 대한 그 견해에 대해서

바로 거기에서 모든 속성을 편집 할 수 있습니다 이미 설정된 해당 뷰에 새 속성을 설정하려면, 더하기 버튼을 클릭하기 만하면됩니다 해당 속성의 이름과 값을 추가하십시오 Attributes 패널에서 할 수있는 또 다른 일 Constraint Widget을 사용하여 여백을 설정합니다 귀하의 의견에 보고 싶어했을거야

숫자와 같은 실제 값만 설정할 수있을뿐만 아니라 증거금의 가치 ​​- 정의 된 맞춤 측정 기준을 설정할 수도 있습니다 프로젝트에서 그것이 우리가 @ dot dot dot option을 추가 한 이유입니다 드롭 다운의 맨 아래에 버튼을 클릭하면 자원 선택 도구가 열리고, 이미 가지고있는 특성 항목을 선택할 수 있습니다 프로젝트에서 정의하거나 바로 거기에 새로운 차원이 있습니다 일어날 필요가있는 마지막 한 가지 – 그 레이아웃을 보면서 – ImageView가 샘플 데이터로 채워지는 것을 볼 수 있습니다

하지만 단지 기본 샘플 데이터 일뿐입니다 Android Studio에서 제공됩니다 그래서 그것은 실제로 그 종류를 대표하지 않습니다 RecyclerView가 런타임에 수신 할 데이터의 양입니다 그래서 당신이 할 수있는 것은 당신 자신의 샘플 데이터를 설정하는 것입니다

그 ImageView에 cities라는 이미지를 cities라는 디렉토리에 추가했습니다 우리 프로젝트의 샘플 데이터 폴더에 있습니다 샘플 데이터 그림에 나타나는지 확인할 수 있습니다 샘플 데이터를 설정할 수 있습니다

우리의 원래 레이아웃으로 돌아가서, 우리는 이제 그것이 많이 보임을 볼 수 있습니다 당신이 가진 원래의 디자인과 더 비슷합니다 거기에서, 당신은 정말로 디자인이 제대로 구현되었으며 실제 데이터를 수신 할 때 작동합니다 장치에서 실행 중입니다 이제 우리는 첫 번째 제약 조건의 구축을 마쳤습니다

첫 번째 화면에서 계속 진행하고 싶습니다 우리의 응용 프로그램에서 우리의 다음 화면을 구축합니다 레이아웃 파일을 만드는 것만으로 돌아 가기보다는, 레이아웃 편집기에서 빌드하고, 우리는 네비게이션을 생각하고 바로 거기에서 시작하고 싶다 우리의 애플 리케이션의 흐름, 그리고 어떻게 첫 번째 화면이 전환됩니다 두 번째 화면으로 그렇게하기 위해 우리는 네비게이션을 살펴볼 것입니다 편집자

탐색 편집기는 시각적 도구입니다 이를 통해 Navigation Architecture를보다 쉽게 ​​사용할 수 있습니다 JetPack 라이브러리의 구성 요소 탐색 아키텍처 구성 요소의 방식 작품은 네비게이션 호스트 단편을 사용하는 것에 의존합니다 응용 프로그램의 기본 레이아웃

여기에 우리의 활동 주 레이아웃 파일, 우리는 Layout Editor에서 드래그 할 것입니다 NavHostFragment 팔레트 – 기본적으로 거기에 있습니다 그것을 디자인 표면 위로 끌어 올 것입니다 그렇게 할 때, 그것은 당신에게 선택을 요구할 것입니다 해당 NavHostFragment와 관련된 탐색 그래프 아직 탐색 그래프를 만들지 않은 경우, 그 대화 상자에서 바로 할 수 있습니다

우리가하는 일이야 이것이 레이아웃이 어떻게 생겼는지입니다 그것은 비어 있습니다 이 NavHostFragment가 있습니다 네비게이션 아키텍처 구성 요소 그것을 채울 것입니다 당신이로드 할 여러 단편들

그러나 두 번 클릭하면 탐색 편집기가 열립니다 이것은 네비게이션 에디터가 비어있을 때 보이는 것과 같습니다 우리가하고 싶은 첫 번째 일 첫 번째 화면을 시작 목적지로 추가합니다 우리의 애플 리케이션을 위해 대상 추가 메뉴에서 앱에있는 모든 레이아웃이 미리 선택되었습니다

그래서 우리를 위해, 우린 그 조각을 환영합니다 이전에 작업해온 레이아웃입니다 바로 거기에 놓으십시오 다음으로, 우리는 두 번째 화면을 추가하기를 원한다 그러나 이미 레이아웃을 만들지 않았기 때문에, 우리는 단순히 새로운 목적지를 만들 수 있습니다

추가 대상 메뉴에서 그렇게하면 생성의 가능성을 얻을 수 있습니다 새로운 프래그먼트 클래스와 그 관련 레이아웃, 이것이 레이아웃이 될 것입니다 두 번째 화면으로 사용됩니다 두 화면이 Navigation Editor에 있으면, 그들을 연결하는 시간이 온다

그것은 행동으로 할 수 있습니다 화면에 표시된대로 작업을 간단하게 만들 수 있습니다 또한 Attributes 패널에서 직접 탐색 편집기의 해당 동작에 대한 속성 중 일부를 설정하고, 애니메이션이 재생되는 것과 같습니다 그 동작을 통해 전환 할 때, 또는 뒤로 누르면 행동으로 할 수있는 또 다른 매우 흥미로운 일 한 화면에서 다음 화면으로 유형 안전 데이터를 전달합니다

그렇게하고 싶다면 다음과 같이 할 수 있습니다 수신 대상에 – 인수 섹션에서 더하기 단추를 클릭하십시오 속성 패널의 단순히 대화 상자를 열면 인수의 이름을 지정하십시오 인수의 유형 그것은 미리 정의 된 유형일 수 있습니다

또는 프로젝트에서 정의한 유형일 수 있습니다 당신이 원하는 어떤 물건이라도 물론, 네비게이션 그래프 만들기 앱 탐색을 완벽하게 지정하기에는 충분하지 않습니다 또한 약간의 코드를 작성해야합니다 그러나 당신이 볼 수있는 것처럼 그것은 꽤 간단합니다

여기, 나는 RecyclerView의 항목에 불과하다 OnClickListener의 경우 전환하려고합니다 그 행동을 끝내라 그래서 내가하는 일은 액션 객체를 만드는 것입니다 내비게이션에서 지정한 인수를 전달합니다

편집자 일단 행동을 취하면 나는 간단하게 탐색 라이브러리의 navigate 메소드 호출 실제로 전환을 수행합니다 그것이 실제로 정의한 전환을 수행하는 데 필요한 전부입니다 탐색 편집기에서 할 수있는 마지막 사항 나머지 네비게이션 흐름을 채우기 위해 자리 표시자를 사용하며, 그 순간에 귀찮게하고 싶지 않으면 새로운 조각 나중에, 그렇게 할 준비가되면, 당신은 단순히 돌아가서 레이아웃으로 대체 할 수 있습니다

지금은 실제로 빌드 할 때가되었다고 생각합니다 우리의 두 번째 레이아웃 보시다시피, 많은 이미지가 포함 된 레이아웃입니다 많은 자원이 필요합니다 우리는 어떻게 자원을 볼 것인가? 관리자는 우리가 그것을 구축하는 데 도움이 될 수 있습니다

VADIM CAEN : 나는 갭을 채우기 전에 이야기하고있었습니다 Android Studio에 존재했던 하나의 차이 리소스를 관리하는 방법이었습니다 문제가 무엇인지 살펴 보겠습니다 Android Studio 리소스 디렉토리 구조 프레임 워크를 위해 만들어진 것이지 실제로는 아닙니다 사용자에게 리소스를 얻을 때 디자이너에게서 보면 이렇게 보일 수도 있습니다

폴더가 많을 수도 있습니다 죄송합니다 먼저 Android Studio에서 다른 문제가 발생했습니다 전체 축소판보기가 없습니다 특정 Android보기

그래서 레이아웃, 벡터 잔해 또는 모양 – 미리 볼 수있는 유일한 방법은 하나의 레이아웃을 두 번 클릭하거나 하나의 파일에 두 번 클릭하는 것입니다 미리보기에서 확인하십시오 이 문제를 해결하기 위해 Android Studio에 도입했습니다 34 Resource Manager는 다음과 같은 새로운 도구입니다

리소스를 가져오고, 사용하고, 탐색 할 수 있도록 도와줍니다 보다 그래픽적인 방식으로 그것을 열려면 간단히 Resource Manager 버튼을 클릭하면됩니다 Android Studio의 왼쪽에있는 프로젝트 버튼 아래, 이 중립 창을 열 것입니다 한번 더 그래서 우리 문제로 되돌아갑니다

왼쪽에는 프로젝트 구조가 있습니다 오른쪽에는 디자이너가 우리에게 준 것을 가지고 있습니다 우리는 파일에서 다른 프로그램을 볼 수 있습니다 디자이너가 우리에게 준 것 어쩌면 그들은 자신이 좋아하는 디자인 소프트웨어를 사용했을 것입니다

기본 내보내기 옵션을 사용했습니다 폴더에 드로어 블 접두어가 누락되었을 수 있습니다 이름 또는 접미사 @ 2x와 함께 웹 형식을 사용했을 수도 있습니다 그리고 당신이해야 할 일은 @ 2x 접미사를 제거하는 것입니다

그런 다음 하나씩 하나씩 파일을 붙여 넣습니다 다른 문제는 폴더가 누락되었을 수 있으며, 그리고 당신은 문서로 돌아 가야 할 것입니다 이 특정 폴더에 대한 한정자가 무엇인지 기억하고, 그리고 당신은 올바른 순서로 그들을 넣어야합니다 Resource Manager와는 어떻게 작동합니까? 이제 전체 묶음을 끌어다 놓기 만하면됩니다 당신이 Resource Manager에 가져온 파일들, 자동으로 가져오고 이름별로 그룹화됩니다

여기에서 볼 수 있듯이 우리의 자원은 이름별로 그룹화되어 있습니다 올바른 한정어가 적용되었습니다 그래서 방금 무슨 일이 있었던거야? [박수 갈채] 고맙습니다 한정어를 식별하면 여기에는 웹 또는 Android가 파일 경로에있을 수 있습니다 우리는 단순히 해당 안드로이드 폴더를 만들 것입니다, 파일에있을 수있는 접미어를 제거하고, 프로젝트에 복사하십시오

물론 한정자를 추가하려는 경우 (예 : 무작위로 지방, 그리고 프랑스어와 같은 임의의 언어, 프랑스와 같은 지역에서는 간단하게 여기에서 할 수 있습니다 그리고 당신은 명령을 기억할 필요가 없습니다 수동으로 폴더를 만들면 자동으로 생성됩니다 올바른 한정어로 이 시점에서 원하는 경우 파일의 이름을 바꿀 수도 있습니다 이제 우리의 자원은 Resource Manager에서 그룹화됩니다

한 번에 모두 볼 수 있습니다 따라서 기본적으로 하나의 리소스 버전 만 표시됩니다 하지만 리소스를 두 번 클릭하면 당신은 모든 다른 버전을 볼 수 있습니다 다른 한정자가 적용되면 분석 할 파일 유형 어떤 파일이 응용 프로그램에서 가장 많은 공간을 차지했는지 자, 이것은 제가 정말로 흥분되는 특징입니다

이제 SVG를 드래그 앤 드롭 할 수 있습니다 VectorDrawable로 변환됩니다 [CROWD CHEERING] 고맙습니다 그래서 여기에 파일 선택기가 열려 있습니다 나는 아무것도 선택할 필요가 없다

간단히 클릭하고 열 수 있으며 모든 SVG를 열 수 있습니다 가져오고 변환됩니다 또 다른 멋진 기능은 모든 레이아웃을 미리 보는 것입니다 이름으로 레이아웃을 인식하는 것이 어려울 수도 있습니다 따라서 레이아웃 탭에서 리소스 관리자를 열면, 모든 레이아웃을 볼 수 있습니다

당신이 찾고있는 것을 찾으려면 전에 말했듯이 도구 체인이 있습니다 이 전체 도구 체인을 함께 통합하려고합니다 우리가 한 것은 통합 된 것입니다 [INAUDIBLE] 레이아웃 편집기로

예를 들어 여기에 포함시키고 자하는 레이아웃이 있습니다 그래서 상단 부분 이 레이아웃을 레이아웃 편집기로 드래그 앤 드롭 만하면됩니다 [INAUDIBLE]을 만듭니다 Drawable에도 똑같이 적용됩니다

Drawable을 드래그 앤 드롭하면 ImageView가 생성됩니다 이 견해의 끝까지 빨리 감습니다 이전 레이아웃에서 볼 수 있습니다 우리 툴바는 올바른 색상이 아닙니다 우리가 할 수있는 것은 컬러 탭을 열고, 우리 프로젝트에 정의 된 모든 색상을 볼 수 있습니다

그 중 하나를 두 번 클릭하기 만하면됩니다 파일을 열어서 커서를 옮깁니다 여기서 색상이 정의됩니다 그런 다음 새로운 색상 선택기를 사용할 수 있습니다 시각적으로 색을 선택하십시오

색상 선택기는 RGB 및 HSB에서 작동하며, HSB를 선택한 디자이너와 함께 일한다면 값을 사용하거나 자료를 사용할 수 있습니다 이미있는 팔레트 이제 두 개의 레이아웃이 준비되었습니다 앱에서 실행하고 싶습니다 Ashley와 Joe가 우리에게 말하기를 다시 환영 할 것입니다

새로운 레이아웃을 검사하는 방법 [박수 갈채] JOE BAKER-MALONE : 감사합니다, 바딤 이제 개발주기의 다음 단계로 넘어갑니다 우리가 실제로 앱을 실행하게되면, 실제 데이터와 함께 작동하는 방법을보고 조정할 수 있습니다 우리가해야 할 수도 있습니다

이제 오늘, 레이아웃이 어떻게 작동하는지보고 싶다면 런타임에는 Layout Inspector 도구가 있습니다 Android Studio에서 레이아웃 속성은 스냅 샷을 제공합니다 한 화면의 전체보기 계층 구조, 및 속성에 대한 일부 정보 각보기에서 설정됩니다 하지만 지금은 많은 한계가 있습니다 이것은 부분적으로 안드로이드 프레임 워크의 데이터에 기인합니다 표시 할 수 있도록 Studio에 제공됩니다

이제 Android Q에서는 프레임 워크에 Studio에 대한 여러 가지 새로운 API 추가 더 많은 뷰 및 레이아웃 디버깅을 노출하는 데 사용 정보 Ashley는 새 API에 대해 곧 이야기 할 것입니다 프레임 워크 추가가 우리에게 충분한 지 확인하려면 우리가 원하는 정보를 사용자에게 보여주고, Android Studio 팀의 우리 부부 프로젝트 마블에서 약간의 시간을 보냈습니다 새 API를 채택하고 우리가 할 수있는 것을 확인하십시오 우리는 완전히 새로운 Layout Inspector 작업을 시작했습니다

내가 너에게 지금 보여줄 것은 일의 몰래 절정이다 우리는 지금까지 해왔습니다 자, 이것은 초기 작업입니다 최신 미리보기 빌드에는 아직 포함되어 있지 않습니다 그러나 차드가 어제 개발자 기조 연설에서 말했듯이, 우리는 미리보기를 좋아합니다

우리는 개발자 의견을 환영합니다 그래서, 우리는 당신의 손에 그것을 밖으로 가져갈 것입니다 최대한 빨리 자, 어떻게 작동하는지 봅시다 Google 여행 앱부터 시작하겠습니다

우리가 해왔 던 이제 에뮬레이터에서 실행 중임을 알 수 있습니다 우리는 물건을 끌어 올려서 사용자로부터 실제 데이터를 실행하고, 디자인 타임에 사용한 샘플 데이터가 아닙니다 여기서 아래로 스크롤하면 볼 수 있습니다 실제 데이터의 일부 여행 설명 우리가 샘플 데이터에서 가지고있는 것보다 상당히 길다 텍스트가 정렬되는 지점까지 우리가 의도하지 않은 방식으로 이미지를 지배했다

새로운 레이아웃 검사기에서 이것을 살펴 보겠습니다 새로운 레이아웃 검사기가 우리에게 제공하는 것을 볼 수 있습니다 레이아웃 검사기에서 현재 가지고있는 것과 유사한보기입니다 문제의 텍스트보기를 선택하면 여기, 그리고 오른쪽에있는 Attributes Panel을보고, 우리는 몇 가지 차이점이 있음을 알 수 있습니다 현재 레이아웃 검사기에서 가지고있는 것입니다

우선, 실제 속성 이름이 있습니다 이전에는 getter 메소드 모음이 있었지만 그렇지 않을 수도 있습니다 잘 실제 속성 이렇게하면지도를 훨씬 쉽게 찾을 수 있습니다 여기서 본 것에서부터 정의한 것에 이르기까지 자신 만의 레이아웃과 스타일로

두 번째로, 우리는 멋지게 형식화 된 속성 값 다양한 가치 유형에 대해 우리는 전에 그것을 항상 얻을 수는 없었다 예를 들어 ID, 열거 형을 볼 수 있습니다 가치, 색깔, 등등 세 번째로, 우리는 지금 몇 가지 정보를 가지고있다 그 속성 값이 설정되는 곳

따라서 우리는이 선언 된 속성 섹션을 볼 수 있습니다 여기, 우리가 Layout Editor에서 가지고있는 것과 비슷합니다 직접 설정된 속성의 경우 선택한보기에서 이제 텍스트 크기와 관련된 속성을 살펴 보겠습니다 이 옵션을 선택하면 기본 탐색 기능을 사용할 수 있습니다 여기에서 직접 키 스트로크를 선언하는 방법 해당 값이 설정되는 레이아웃 xml로 이동합니다

조금 더 작게 변경하십시오 개발자 기조 연설에서 들었던 것처럼, Android Studio 35 미리보기에서 이 새로운 변경 기능을 적용하십시오 이것 이후에 바로 그 부분에 대해 더 많은 것을들을 수 있습니다 Android 개발자 도구에서 새로 워진 이야기

하지만 지금은 에뮬레이터의 변경 사항을 확인하는 데 사용하겠습니다 우리의 애플 리케이션을 재배치 할 필요없이 실제로 새로운 레이아웃에서 업데이트가 즉시 표시됩니다 경감 님 Layout Inspector가 무엇을 미러링하고 있기 때문입니다

기기 라이브에서 발생합니다 우리가 여기서 다시 스크롤한다면, 레이아웃 검사기가 오른쪽으로 스크롤되는 것을 볼 수 있습니다 게다가 [박수 갈채] 예 다른 시나리오를 살펴 보겠습니다

앱의 어두운 테마를 구현하고 싶다고 가정 해 보겠습니다 여기서 우리는 밝은 배경색을 가지고 있음을 알 수 있습니다 배경색이 어디인지 알아 보겠습니다 에서 온다 우리가 여기에있는 단편 xml을 보면, 우리는 거기에 직접 설정되어 있지 않습니다

Layout Inspector를 살펴 보겠습니다 여기서 배경을 선택하면, 정말 잘 볼 수 있다면 우리는 배경색이 없다

이보기에서 직접 설정하십시오 왜 그럴까? 글쎄, 우리는 여기에서 가장 많은보기를 선택했습니다 배경색을 어느 정도 낮추어 놓을 수도 있습니다 뷰 계층 구조에서 그러나 어떤 시각이 설정되고 있습니까? 글쎄, 새로운 레이아웃 검사기가 우리에게 제공합니다

쉽게 찾을 수있는 방법 [크라우드 반응] [웃음] 3D보기에서는 어느 것이 쉽게 볼 수 있습니다 여기에서 무엇을 그리는가? 이제이보기를 선택하면 배경이 색상이 실제로 설정되어 있습니다 그러나 어떤 파일에 설정되어 있습니까? 이것은 선언 된 속성 섹션의 맨 위에 있지 않습니다 그래서 우리는 그것이이 견해에 직접적으로 설정되어 있지 않다는 것을 알고 있습니다

그러나 다시 한번 우리가 Attributes에서 속성을 선택하면 Panel, 거기에서 직접 탐색 할 수 있습니다 그것이 설정되는 곳으로 이 경우 스타일로 설정됩니다 그리고 우리는 그 스타일을 직접 탐색 할 수 있습니다 보기에 명시 적으로 참조되지 않는 경우에도 마찬가지입니다

우리가 본 3D 표현은 우리는 다른 방식으로 사물을 시각화하고, 여기서 유용한 정보를 계속 찾고 있습니다 예를 들어 초점을 맞추는 것이 유용 할 수 있습니다 한보기 및 그 자녀들에게 또는 무엇을 기반으로보기를 함께 그룹화하는 것이 유용 할 수 있습니다 그들이 정의 된 레이아웃 파일

이 화면의 예는 상단에서 볼 수 있습니다 우리는 RecyclerView 항목을 가지고 조각을 만든 다음, 활동 그리고 그 뒤에, 다양한 견해들 프레임 워크에 의해 정의됩니다 가벼운 새로운 레이아웃 검사기를 위해 더 많은 계획을 세웠습니다 저는 우리가 무엇을 생각해 낼 수 있는지에 대해 매우 기쁩니다

이제는 필요한 프레임 워크 변경 사항에 대해 이야기합니다 이것을 가능하게하려면 여기 애쉴리가 있습니다 애쉴리 로즈 : 고마워, 조 [박수 갈채] Android Q의 경우 세 가지 새로운 API가 추가되었습니다 이러한 새로운 검사 기능을 사용할 수 있습니다

우리는 모든 도면 명령을 수행 할 수 있습니다 화면에 프레임을 만들었습니다 그것을 직렬화하여 Studio로 다시 보내십시오 그래서 그것들을 재생할 수 있고 멋진 3D보기를 만들 수 있습니다 우리는 얼마나 길게 빨랐 는가? 뷰 계층 구조에서 뷰의 특성을 가져오고, 추가 메타 데이터를 추가 할 수 있습니다

그것을보다 정확하게 만드는 것입니다 그리고 우리는 리소스 프레임 워크에 몇 가지 새로운 API를 추가했습니다 속성 값의 출처를 보자 의사 결정에 대한 더 많은 통찰력 그 과정은 다음과 같은 경우에 적용되었다 해당 속성 값에 도달합니다

그럼 Skia Picture에 대해 이야기 해 봅시다 Skia는 UI 툴킷의 기초가되는 2D 그래픽 라이브러리입니다 이것은 실제로 슬라이드에 맞도록 단순화 된보기입니다 하지만 그것은 그리기 명령의 목록입니다 더 일찍부터 우리 여행 카드 중의 1 개를 형성하는 것에 들어간다

우리가 그것을 보았다면 그림자, 둥근 사각형, 이미지, 텍스트 – 그 모든 것들을 자산과 함께 그것을 렌더링하는데 필요한 이미지 데이터, 폰트 데이터 등을 포함한다 우리는 Skia에서 이것을 기본적으로 얻습니다 매우 빠릅니다 실시간 미리보기를 수행 할 수 있기 때문에 이걸 몇 초에 한 번하십시오 그것은 일반적으로 매우 작습니다

그러나이 문제는 우리가 스위치를 확대하려면 여기를 클릭하십시오 그것은 텍스트, 둥근 사각형, 그리고 서클 슬라이더 스위치에 대한 약간의 이미지 그것들이 어떤 관점에서 왔는지는 모른다 그들은 명령을 내리는 것입니다 그리기 명령을 그룹화하는 방법이 필요했습니다

그들이 어떤 시각에서 왔는지에 따라 우리는 렌더링 노트 API를 보았습니다 두보기의 기초가되는 조직 트리입니다 그리고 drawables– 우리는 각각의 렌더링 노트에 고유 한 ID를 추가했습니다 그런 다음이 고유 한 ID를보기에 노출 시켰습니다

Skia 그림 자체에 주석을 달았습니다 여기서 각 렌더 노드는 그리기를 시작하고 멈 춥니 다 스튜디오 측에서 보기가 시작된 위치와 중단 된 위치를 확인하고 연결할 수 있습니다 이 3 개의 그리기 명령은 다시 스위치보기로 돌아갑니다 또한 우리는 시작과 중지가 있기 때문에, 우리는 멋진 중첩 된 프레임 워크를 가지고 있습니다

HTML – 우리가 볼 수있는 모든 도면 명령이 다시 있습니다 단순화 된이 카드보기를 만드는 데 들어갔다 같이 [? 오랫동안도?] 그들이 시작하고 멈추는 전망, 우리는 중첩을 해봅시다 부동산 검사를 어떻게 수정하는지 조금 이야기 해 봅시다 Joe의 관점에서 일찍 – 모든 것이 게터 이름이나 메소드 이름이었습니다

그건 우리가 반사를 사용했기 때문이었습니다 런타임시 뷰 인스턴스 내부의 속성 반사는 세계에서 가장 빠른 것이 아닙니다 특히 휴대 기기에서 매우 복잡한 앱의 경우 전체보기를 렌더링하는 데 최대 몇 초가 걸릴 수 있습니다 계층

그래서 우리는 다음과 같은 접근 방식을 들여다 보았습니다 모든 것을 직렬화하는 메서드가 있습니다 그것은 조금 부서지기 시작합니다 보기에 새 속성을 추가하면 업데이트되지 않습니다 우리는 주석 처리기에 추가했습니다

그것은 우리가 반사를 유연하게 유지할 수있게 해줍니다 우리를 제공했다 특수 효과를 추가하기 만하면됩니다 새 게터를 추가하면됩니다 사용자 정의에 대해 어떻게 보일지 살펴 보겠습니다

이는 사용자가 누구에게나 관련이 있기 때문에 볼 수 있습니다 곧 라이브러리보기를 빌드하십시오 우리는 컬러보기를했습니다 속성은 색이며 주석을 달았습니다 InspectableProperty

주석 처리기가 보이면 그것으로 우리에게 조금 더 많은 맥락이 생깁니다 우리가 이전에 얻은 것보다 훨씬 낫습니다 그래서 우리는 Kotlin에 있고 @ColorInt 주석을 볼 수 있습니다 정수형뿐만 아니라 우리는이 정수에 색을 채웠다는 것을 압니다 그리고 그것은 단지 수치가 아닙니다

재산의 이름이 있습니다 우리는 속성 ID에 대한 추론을하는 데 사용할 수 있습니다 그것을 부르는 것 물론 우리는 주석에 대한 속성을 사용하여 추론하기 그 자체 그래서이 코드 생성은 어떻게 생겼습니까? 이 객체는 이 견해와 나란히 앉을 것이다

그 중 하나가 어떻게 생겼는지 살펴 보겠습니다 이것은 검사 동반자입니다 그것은 Q를위한 새로운 API입니다 두 가지 목적이 있습니다 하나는 클래스가 주어진 경우의 목록을 정의합니다

여기에 그 클래스에 정의 된 속성이 있습니다 이 경우 색상을 정의했습니다 지도 색상에 대한 호출을 살펴보면, 색깔이기 때문에 거기에 유형이 있습니다 우리는 속성 이름을 가지고 있고 유추했습니다 ID의 속성 R

attr 이것은 또한 우리가 – 추론 된 속성 ID가없는 경우, 또는 당신이 하나를 공급했다면 우리는 그것을 거기에 넣을 것입니다 내가보기에 Studio를 가르치면, 여기에 내가 가지고있는 속성이 있습니다 여기에 그들의 속성 ID가 무엇인지, 이것은 우리가 그 부분을 가능하게합니다 코드 완성 기능으로 이동하십시오

다음 단계는 실제로 우리가 보기의 인스턴스가 있으면 속성을 읽고 싶습니다 다시 말하지만, 우리의 견해가 Kotlin에서 정의되고 자바를 사용하고 있기 때문에 – 이것이 생성 된 코드이기 때문에 – 우리는 viewgetColor를 호출한다 직접 호출한다 getter에게 반사가 필요 없습니다

매우 빠릅니다 이를 통해 뷰 계층의 실시간 업데이트를 수행 할 수 있습니다 Studio에서는 우리가 가지고 있지 않기 때문에 우리가 전에했던 모든 추가적인 오버 헤드 우리를 얻는 모든 것이 현재의 가치에 달려 있습니다 우리가 말할 수있는 것은 여기에 우리가 가지고있는이 사랑스러운 푸른 색 텍스트 색입니다

우리는 그것이 무엇인지에 관계없이 말할 수 있습니다 그것이 런타임에 설정되었는지 여부 viewsetColor를 호출했을 수도 있습니다 또는 자원에 설정되어있는 경우

그러나 대부분의 속성 값은 자원에서 설정되며, 그래서 우리는 그 사건을 돕고 싶었습니다 우리는이 경우에, 그것은 위젯에 정의되어 있습니다 리소스에 API를 추가하여, 나는이 가치를 얻었다 그게 어디서 왔는지 말해줘 Google은 해당 데이터를 추적하여 전체 리소스를 통해 저장합니다

뼈대 또한, 우리는 통찰력을 얻고 싶었습니다 스타일이 어떻게 영향을 미치는지 그래서 자원 프레임 워크가 해결 될 때 속성 값 – 어떤 스타일을 적용할지 결정해야합니다 의사 결정 트리를 가져 와서 API를 추가하여이를 나타냅니다

근본적으로 고려 된 스타일 목록입니다 그러나 결국 사용되거나 사용되지 않을 수 있습니다 해당 속성 값을 해석하는 동안 이 모든 문제는 일시적인 현상입니다 왜냐하면보기, 일단 팽창되면, 그들은 그들의 관계를 잊는다 리소스

일단 그들이 건설되면, 그들은 그들이 어디에서 온 것인지 기억하지 못한다 개발자 옵션을 추가했습니다 속성 ID의 맵과, 그들이 왔던 곳, 스타일 해상도는보기의 테마에서 스택됩니다 그래서 스튜디오 – 준비가되었거나 관심이있을 때 재산으로 더 자세히 조사하고 싶어요 돌아와

보기로하고,보기에게 묻는다, 헤이, 어디에서 당신의 속성 값이 왔는지, 그들의 스타일은 무엇입니까? Q가 가진 모든 것을 꽤 많이 감쌌다 바딤과 제롬을 환영하고 싶습니다 우리를 감싸는 무대에 [박수 갈채] VADIM CAEN : 전체 툴 체인에 대해 들었습니다

그리고 집에 돌아갈 때 그것을 사용하기를 바랍니다 레이아웃 편집기로 레이아웃을 작성하고, 우리가 추가 한 새로운 기능 네비게이션 편집기로 네비게이션 만들기, 자원 관리자로 자원 관리, 새로운 레이아웃 검사기로 검사를 수행하십시오 올해 I / O에는 Android Studio 협상이 가득합니다 바로 뒤에 – 원형 극장에서 – 당신은 안드로이드 개발의 새로운 기능을 볼 수 있습니다

Tor 및 [? Ja ?] 그렇다면 당신은 2 단계의 Android 빌드 시스템의 새로운 기능 그것은 다른 쪽 위에있다 그것은 오늘 오후에 시작한다 여기에 빨간 점이 거의 없습니다 Android Studio 팁 및 트릭 제공 선별 된 엔지니어 및 프로젝트 매니저에 의해, 2 단계

마지막으로 내일, ConstraintLayout의 새로운 기능 Nicolas와 John의 모션 레이아웃 우리는 여기서 밖에 질문을 할 것입니다 와 주셔서 대단히 감사합니다 내년에 봐 [음악 재생]

Turn off ‘USB Debugging’ option in your Android Device. (여러분의 안드로이드 기기에서 ‘USB 디버깅’옵션을 꺼주세요.)

안드로이드 기기를 작은 장치에 연결해보겠습니다 무슨 일이죠?! 조작도 없이 가짜 악성 앱이 설치되고 실행되었습니다!!!! 어떻게 동작하는 것일까요?? 이 기기에는 'USB 디버깅' 옵션이 활성화되어있습니다

USB 디버깅 옵션은 개발을 지원하기위해 만들어졌습니다 이 옵션은 테스트 앱 설치와 디버깅을 쉽게 해줍니다 이 옵션이 활성화되어있으면, PC의 악성소프트웨어도 이 옵션을 사용할 수 있습니다 그래서 악성소프트웨어는 악성앱을 아무메세지없이 연결된 안드로이드 기기에 설치할 수 있습니다

왜 이 옵션이 활성화되었을까요? 비활성화가 기본값이지만, 여러분이 여러분의 기기를 루팅하려고 했거나, 또는 몇몇 앱이 요구해서 여러분이 활성화했거나, 또는 여러분은 개발자일겁니다 라즈베리파이같은 작은 장치들도 안드로이드기기에 앱을 설치할 수 있습니다 그래서 이 기법은 공공충전기나 작은 가게에 적용될 수 있습니다 안드로이드 42

2는 알 수 없는 PC의 접근을 막는 기능이 들어있지만 96%가 넘는 안드로이드 기기는 이전 버전을 탑재하고 있습니다 여러분이 알림바에 이 옵션에 대한 아이콘을 보셨다면 이 옵션이 활성화되어있는 것입니다 이 아이콘이 알림바에 있으면 알려지지않은 PC나 공공충전기에 연결하기 전에 여러분의 안드로이드기기에서 이 옵션을 끄세요 여러분의 개인정보를 지킬 수 있습니다 iOS 역시 유사한 문제가 있습니다

저는 iOS의 문제에 대한 기사를 보고 이것을 만들었습니다 하지만 안드로이드의 경우보다 여럽습니다 시청해주셔서 감사합니다

Debugging and testing in Android Studio (Ep 4, Android Studio)

코드의 버그를 잡느라 많은 시간을 보냈거나 성능의 문제를 찾기 위해 스토어에 앱을 발매한 적이 있다면 최근 버전의 안드로이드 스튜디오에 추가된 새로운 디버깅과 테스트에 고마워하게 될 겁니다 한 번 살펴 보죠 안드로이드 스튜디오에서 이용 가능했던 메모리 모니터에 새로운 CPU 모니터가 가능해졌습니다 이 기능은 앱의 운영이 기기에 주는 영향을 개략적으로 설명해, 성능의 문제를 미리 발견할 수 있도록 해 줍니다 더 자세한 정보가 필요하면 당장이라도 객체 추적 할당의 시작과 나중 분석을 위한 메모리의 폐기 심지어 IDE로부터 직접추적방식을 시작할 수 있습니다 또한 새로운 성능 캡쳐 판은 제작된 모든 레포트에 빠르게 접근하도록 해줍니다 이는 손실되고 있는 메모리를 찾거나 앱 성능의 입계영역 확인에 유용합니다 더 좋은 점은, 메모리 손실이 어디서 기인하는 지 코드의 어떤 조각이 앱의 조회를 막는 지 찾고 무가치한 데이터로의 수집을 방지하는 것입니다 라이프디버깅 세션에서 이러한 정보를 즉시 볼 수 있습니다 첫 번째, 디버그 버튼을 사용하여 앱을 실행하거나 작성 프로세스를 사용합니다 접속에 성공하면, IDE는 개발자가 명시하는 모든 지점의 진행을 중단시킬 것입니다 이제 객체 대상 명령을 선택하여 현재 브라우저 모두에서 필요한 정보를 얻을 수 있죠 단계적인 디버깅에 대해 이야기 하자면 프로젝트에서 놓친 소스코드를 찾기위해 서드 파티 라이브러리를 이용한 적이 있나요? 안드로이드 스튜디오는 새로 자바가 포함된 역컴파일으로 여러분을 도울 것입니다 이제부터 언제든지 내부 클래스를 확인하고자 할 때는 단지 에디터에서 JAR 파일을 한번 클릭하면 됩니다 심지어 중단점을 지정하여 편집된 코드의 내부에서 디버깅을 할 수도 있습니다 정말 좋지요? 안드로이드 스튜디오 12의 또 다른 훌륭한 특징은 코드 편집자의 디버깅 시 로컬 브라우저에서의 인라인의 값입니다 따로 변수 판에서 찾을 필요가 없습니다 마우스를 움직여 연산자 식을 볼 때 결과 값이 팝업되는데 더 자세히 보기 위해 마우스를 변수에 놓는 것과 같습니다 하지만 아시다시피 디버깅에 있어서 최악은 디버깅 자체입니다 그것이 바로 개발자가 앱을 처음부터 테스트 해야하는 이유입니다 발전한 그래들 플러그인과 안드로이드 스튜디오 덕에 자동 테스트를 작성하고 실행하는 방법이 가능합니다 테스트 주도적인 개발이건, 빠른 코드 테스트건 단지 코드를 빠르게 테스트하기를 원하건 테스트를 기기로 배치해야 하는 게 가장 귀찮은 일입니다 이것은 상당한 시간이 걸립니다 안드로이드 스튜디오 1

1부터 로컬 JVM을 쓰는 기계의 개발 운영 유닛 테스트 지원이 있습니다 우선 JUnit 테스트를 개발자 안드로이드 모듈의 테스트 폴더에 넣습니다 테스트 테스크를 작동 시킬때 그래들은 특별 버전의 안드로이드 JAR을 생성합니다 JAR는 워킹 코드가 아니기 때문에 아무 프레임워크나 사용하면 안 됩니다 MOckito같이 잘 알려진 가상 라이브러리 하나를 사용해서 안드로이드 의존성을 점검해 보세요 기기의 운영을 위해 필요한 테스트는 충분한 프레임워크가 필요하며 안드로이드 테스트 소스 세트를 사용할수 있습니다 이런 테스트는 앱과 대상 기기 또는 에뮬레이터와 함께 배치될 수 있습니다 안드로이드 스튜디오와 그래들의 일부는 아니지만 최근에 출시된 라이브러리는 포함클래스가 많아 작성과 테스트의 운영을 도와줍니다 안드로이드 테스팅 서포트 라이브러리라고도 부릅니다 안드로이드 서포트저장소에서 이것을 찾을 수 있습니다 이것은 최신 테스팅 프레임워크와 구글이 만든 APIs를 제공하는데 여기엔 서포트를 위한 JUnit과 안드로이드 테스트 러너, 기능적 UI 테스팅을 위한 에스프레소 라이브러리 UIAutomator 등이 포함 되어 있습니다 프로젝트 테스트 운영의 설치에 대해서는 안드로이드 테스팅 서포트 라이브러리를 사용하는 방법을 알고 싶으면 다음 링크를 확인하여 문서와 샘플을 찾으십시오 안드로이드 스튜디오를 이용한 앱 디버깅에 관련한 질문이나 제안이 있으면 Google+커뮤니티의 토론에 참가하세요 그럼 다음에 뵙겠습니다 [음악재생]