summaryrefslogtreecommitdiffstats
path: root/docs/html-intl/intl/ru/design/material/index.jd
diff options
context:
space:
mode:
Diffstat (limited to 'docs/html-intl/intl/ru/design/material/index.jd')
-rw-r--r--docs/html-intl/intl/ru/design/material/index.jd186
1 files changed, 186 insertions, 0 deletions
diff --git a/docs/html-intl/intl/ru/design/material/index.jd b/docs/html-intl/intl/ru/design/material/index.jd
new file mode 100644
index 0000000..2cfd91e
--- /dev/null
+++ b/docs/html-intl/intl/ru/design/material/index.jd
@@ -0,0 +1,186 @@
+page.title=Material Design
+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>Создание приложений с помощью Material Design</p>
+ </div>
+</a>
+
+<!-- video box -->
+<a class="notice-developers-video" href="https://www.youtube.com/watch?v=p4gmvHyuZzw">
+<div>
+ <h3>Видеоролик</h3>
+ <p>Введение в Material Design</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>Material Design в приложениях для конференции Google I/O</p>
+</div>
+</a>
+
+
+
+<p itemprop="description">Material Design представляет собой комплексную концепцию создания визуальных, движущихся и
+ интерактивных элементов для различных платформ и устройств. Теперь Android включает в себя поддержку
+приложений с элементами Material Design. Чтобы использовать элементы Material Design в своих приложениях под Android, руководствуйтесь инструкциями
+в <a href="http://www.google.com/design/spec">спецификации Material Design</a>, а также воспользуйтесь
+новыми компонентами и функциями, доступными в Android 5.0 (уровень API 21) и выше.</p>
+
+<p>Android предоставляет следующие элементы для построения приложений в соответствии с концепцией Material Design:</p>
+
+<ul>
+ <li>новую тему;</li>
+ <li>новые виджеты для сложных представлений;</li>
+ <li>новые API-интерфейсы для нестандартных теней и анимаций.</li>
+</ul>
+
+<p>Дополнительные сведения о реализации Material Design в Android см. в разделе
+<a href="{@docRoot}training/material/index.html">Создание приложений с помощью Material Design</a>.</p>
+
+
+<h3>Тема Material Design</h3>
+
+<p>Тема Material Design предоставляет новый стиль для ваших приложений, системные виджеты, для которых можно настраивать
+цветовую палитру, и анимации, выполняемые по умолчанию в качестве реакции на касание и при переходах между действиями.</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">Тема Material Design в темных тонах</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">Тема Material Design в светлых тонах</p>
+ </div>
+</div>
+<br style="clear:left"/>
+</div>
+
+<p>Дополнительные сведения см. в разделе <a href="{@docRoot}training/material/theme.html">Использование темы
+Material Design</a>.</p>
+
+
+<h3>Списки и подсказки</h3>
+
+<p>Android предоставляет два новых виджета для отображения подсказок и списков с использованием стилей
+и анимаций Material Design:</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-интерфейсы анимации позволяют создавать нестандартную анимацию для реакции на касание в элементах пользовательского интерфейса,
+изменения состояниия представления и переходов между действиями.</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>Следующие возможности по работе с графическими объектами облегчают реализацию приложений с элементами Material Design:</p>
+
+<ul>
+<li><strong>векторные объекты</strong> можно масштабировать без ущерба для четкости, и они отлично подходят
+в качестве одноцветных значков приложения;</li>
+<li><strong>тонирование графических объектов</strong> позволяет определять растровые изображения как альфа-маску и тонировать их
+нужным цветом во время выполнения;</li>
+<li><strong>извлечение цвета</strong> позволяет автоматически извлекать главные цвета из
+растровых изображений.</li>
+</ul>
+
+<p>Дополнительные сведения см. в разделе <a href="{@docRoot}training/material/drawables.html">Работа с
+элементами дизайна</a>.</p>