summaryrefslogtreecommitdiffstats
path: root/docs/html-intl/intl/ko/design/material/index.jd
diff options
context:
space:
mode:
Diffstat (limited to 'docs/html-intl/intl/ko/design/material/index.jd')
-rw-r--r--docs/html-intl/intl/ko/design/material/index.jd186
1 files changed, 186 insertions, 0 deletions
diff --git a/docs/html-intl/intl/ko/design/material/index.jd b/docs/html-intl/intl/ko/design/material/index.jd
new file mode 100644
index 0000000..31992fa
--- /dev/null
+++ b/docs/html-intl/intl/ko/design/material/index.jd
@@ -0,0 +1,186 @@
+page.title=머티어리얼 디자인
+page.tags=Material,design
+page.type=design
+page.image=design/material/images/MaterialLight.png
+
+@jd:body
+
+<!-- developer docs box -->
+<a class="notice-developers right" href="{@docRoot}training/material/index.html">
+ <div>
+ <h3>개발자 문서</h3>
+ <p>머티어리얼 디자인으로 앱 생성</p>
+ </div>
+</a>
+
+<!-- video box -->
+<a class="notice-developers-video" href="https://www.youtube.com/watch?v=p4gmvHyuZzw">
+<div>
+ <h3>비디오</h3>
+ <p>머티어리얼 디자인 소개</p>
+</div>
+</a>
+
+<!-- video box -->
+<a class="notice-developers-video" href="https://www.youtube.com/watch?v=YaG_ljfzeUw">
+<div>
+ <h3>비디오</h3>
+ <p>종이와 잉크: 중요한 머티어리얼</p>
+</div>
+</a>
+
+<!-- video box -->
+<a class="notice-developers-video" href="https://www.youtube.com/watch?v=XOcCOBe8PTc">
+<div>
+ <h3>비디오</h3>
+ <p>Google I/O 앱 내 머티어리얼 디자인</p>
+</div>
+</a>
+
+
+
+<p itemprop="description">머티어리얼 디자인은 플랫폼 및 기기 전반의 표현 방식, 모션 및
+상호 작용 디자인에 대한 종합적인 지침입니다. Android에는 이제
+머티어리얼 디자인 앱에 대한 지원이 포함되었습니다. Android 앱에서 머티어리얼 디자인을 사용하려면 <a href="http://www.google.com/design/spec">머티어리얼 디자인 사양</a>에
+규정되어 있는 지침을 따르세요. 또한 Android 5.0(API 레벨 21) 이상에서 제공하는
+새 구성 요소 및 기능을 사용하세요.</p>
+
+<p>Android는 머티어리얼 디자인 앱을 구축하는 데 사용할 수 있는 다음 요소를 제공합니다.</p>
+
+<ul>
+ <li>새로운 테마</li>
+ <li>복잡한 뷰를 위한 새로운 위젯</li>
+ <li>사용자 지정 그림자 및 애니메이션을 위한 새로운 API</li>
+</ul>
+
+<p>Android에서 머티어리얼 디자인을 구현하는 방법에 대한 자세한 내용은
+<a href="{@docRoot}training/material/index.html">머티어리얼 디자인으로 앱 생성</a>을 참조하세요.</p>
+
+
+<h3>머티어리얼 테마</h3>
+
+<p>머티어리얼 테마는 앱에 사용할 수 있는 새로운 스타일, 색상표를
+설정할 수 있는 시스템 위젯, 그리고 터치 피드백 및 액티비티 전환을 위한 기본 애니메이션을 제공합니다.</p>
+
+<!-- two columns -->
+<div style="width:700px;margin-top:25px;margin-bottom:20px">
+<div style="float:left;width:250px;margin-left:40px;margin-right:60px;">
+ <img src="{@docRoot}design/material/images/MaterialDark.png" width="500" height="238" />
+ <div style="width:140px;margin:0 auto">
+ <p style="margin-top:8px">어두운 머티어리얼 테마</p>
+ </div>
+</div>
+<div style="float:left;width:250px;margin-right:0px;">
+ <img src="{@docRoot}design/material/images/MaterialLight.png" width="500" height="238" />
+ <div style="width:140px;margin:0 auto">
+ <p style="margin-top:8px">밝은 머티어리얼 테마</p>
+ </div>
+</div>
+<br style="clear:left"/>
+</div>
+
+<p>자세한 내용은 <a href="{@docRoot}training/material/theme.html">머티어리얼
+테마 사용</a>을 참조하세요.</p>
+
+
+<h3>목록 및 카드</h3>
+
+<p>Android는 머티어리얼 디자인 스타일
+및 애니메이션으로 카드 및 목록을 표시하는 데 사용할 수 있는 두 개의 새로운 위젯을 제공합니다.</p>
+
+<!-- two columns -->
+<div style="width:700px;margin-top:25px;margin-bottom:20px">
+<div style="float:left;width:250px;margin-left:40px;margin-right:60px;">
+ <img src="{@docRoot}design/material/images/list_mail.png" width="500" height="426" />
+ <p>새로운 <code>RecyclerView</code> 위젯은 <code>ListView</code>의
+플러그 기능이 개선된 버전으로, 다양한 레이아웃 유형을 지원하고 향상된 성능을 제공합니다.</p>
+</div>
+<div style="float:left;width:250px;margin-right:0px;">
+ <img src="{@docRoot}design/material/images/card_travel.png" width="500" height="426" />
+ <p>새로운 <code>CardView</code> 위젯은 일관적인 모양 및 느낌이 있는
+카드 내 정보의 중요한 부분을 표시할 수 있게 해줍니다.</p>
+</div>
+<br style="clear:left"/>
+</div>
+
+<p>자세한 내용은 <a href="{@docRoot}training/material/lists-cards.html">목록
+및 카드 생성</a>을 참조하세요.</p>
+
+
+<h3>뷰 그림자</h3>
+
+<p>X 및 Y 속성과 더불어 이제 Android의 뷰에는 Z
+속성이 추가되었습니다. 이 새로운 속성은 다음을 결정하는 뷰의 엘리베이션을 나타냅니다.</p>
+
+<ul>
+<li>그림자 크기: 뷰의 Z 값이 클수록 표시되는 그림자도 커집니다.</li>
+<li>그리기 순서: 뷰의 Z 값이 클수록 다른 뷰의 위에 표시됩니다.</li>
+</ul>
+
+<div style="width:290px;margin-left:35px;float:right">
+ <div class="framed-nexus5-port-span-5">
+ <video class="play-on-hover" autoplay>
+ <source src="{@docRoot}design/material/videos/ContactsAnim.mp4"/>
+ <source src="{@docRoot}design/videos/ContactsAnim.webm"/>
+ <source src="{@docRoot}design/videos/ContactsAnim.ogv"/>
+ </video>
+ </div>
+ <div style="font-size:10pt;margin-left:20px;margin-bottom:30px">
+ <em>영화를 재생하려면 기기 화면을 클릭합니다.</em>
+ </div>
+</div>
+
+<p>자세한 내용은 <a href="{@docRoot}training/material/shadows-clipping.html">그림자
+정의 및 뷰 클리핑</a>을 참조하세요.</p>
+
+
+<h3>애니메이션</h3>
+
+<p>새 애니메이션 API는 UI 컨트롤 내의 터치 피드백, 뷰 상태
+변화, 그리고 액티비티 전환을 위한 사용자 지정 애니메이션을 생성할 수 있게 해줍니다.</p>
+
+<p>이 API를 사용하면 다음 작업을 수행할 수 있습니다.</p>
+
+<ul>
+<li style="margin-bottom:15px">
+<strong>터치 피드백</strong> 애니메이션으로 뷰 내 터치 이벤트에 응답하기.
+</li>
+<li style="margin-bottom:15px">
+<strong>회전하며 나타나기</strong> 애니메이션으로 뷰 감추기 및 표시하기.
+</li>
+<li style="margin-bottom:15px">
+사용자 지정 <strong>액티비티 전환</strong> 애니메이션으로 액티비티 간 전환하기.
+</li>
+<li style="margin-bottom:15px">
+<strong>커브 모션</strong>으로 더 자연스러운 애니메이션 생성하기.
+</li>
+<li style="margin-bottom:15px">
+<strong>뷰 상태 변경</strong> 애니메이션으로 하나 이상의 뷰 속성 변경 사항 애니메이션화하기.
+</li>
+<li style="margin-bottom:15px">
+뷰 상태 변경 간에 <strong>상태 목록 드로어블</strong>에서 애니메이션 표시하기.
+</li>
+</ul>
+
+<p>터치 피드백 애니메이션은 버튼과 같은 여러 기본 뷰에 내장되어 있습니다. 새 API를 사용하면 이러한 애니메이션을 사용자 지정하고 사용자 지정 뷰에 추가할 수
+있습니다.</p>
+
+<p>자세한 내용은 <a href="{@docRoot}training/material/animations.html">사용자지정
+애니메이션 정의</a>를 참조하세요.</p>
+
+
+<h3>드로어블</h3>
+
+<p>드로어블에 대한 다음과 같은 새 기능을 통해 머티어리얼 디자인 앱을 쉽게 구현할 수 있습니다.</p>
+
+<ul>
+<li><strong>벡터 드로어블</strong>은 단색 인앱 아이콘에
+적합하며, 정의 손실 없이 확장 가능합니다.</li>
+<li><strong>드로어블 색조</strong>를 사용하면 비트맵을 알파 마스크로 정의할 수 있으며, 런타임에
+색을 입힐 수 있습니다.</li>
+<li><strong>색상 추출</strong>은
+비트맵 이미지에서 주요 색상을 자동으로 추출할 수 있게 해줍니다.</li>
+</ul>
+
+<p>자세한 내용은 <a href="{@docRoot}training/material/drawables.html">Drawable
+사용</a>을 참조하세요.</p>