Home | History | Annotate | Download | only in material
      1 page.title=  
      2 
      3 @jd:body
      4 
      5 <div id="tb-wrapper">
      6 <div id="tb">
      7 <h2>   </h2>
      8 <ol>
      9   <li><a href="#ColorPalette"> </a></li>
     10   <li><a href="#StatusBar">  </a></li>
     11   <li><a href="#Inheritance">   </a></li>
     12 </ol>
     13 <h2> </h2>
     14 <ul>
     15   <li><a href="http://www.google.com/design/spec">  </a></li>
     16   <li><a href="{@docRoot}design/material/index.html">Android  </a></li>
     17 </ul>
     18 </div>
     19 </div>
     20 
     21 
     22 <p>      .</p>
     23 
     24 <ul>
     25   <li>     </li>
     26   <li>    </li>
     27   <li>  </li>
     28 </ul>
     29 
     30 <p>    ID       .
     31  <a href="#fig3"> 3</a>             .
     32 </p>
     33 
     34 <p>        .  ,   ,     .
     35 </p>
     36 
     37 <p>    .</p>
     38 
     39 <ul>
     40   <li><code>@android:style/Theme.Material</code> ( )</li>
     41   <li><code>@android:style/Theme.Material.Light</code> ( )</li>
     42   <li><code>@android:style/Theme.Material.Light.DarkActionBar</code></li>
     43 </ul>
     44 
     45 <p>   
     46 {@link android.R.style R.style} API  .</p>
     47 
     48 <!-- two columns, dark/light material theme example -->
     49 <div style="width:700px;margin-top:25px;margin-bottom:10px">
     50 <div style="float:left;width:250px;margin-left:40px;margin-right:60px;">
     51   <img src="{@docRoot}design/material/images/MaterialDark.png" width="500" height="238">
     52   <div style="width:170px;margin:0 auto">
     53   <p style="margin-top:8px;font-size:12px"><strong> 1</strong>.   </p>
     54   </div>
     55 </div>
     56 <div style="float:left;width:250px;margin-right:0px;">
     57   <img src="{@docRoot}design/material/images/MaterialLight.png" width="500" height="238">
     58   <div style="width:170px;margin:0 auto">
     59   <p style="margin-top:8px;font-size:12px"><strong> 2</strong>.   </p>
     60   </div>
     61 </div>
     62 <br style="clear:left">
     63 </div>
     64 
     65 <p class="note">
     66 <strong>:</strong>   Android 5.0(API  21)    .
     67  <a href="{@docRoot}tools/support-library/features.html#v7">v7  </a>
     68           .
     69   
     70 <a href="{@docRoot}training/material/compatibility.html"> </a> .
     71 </p>
     72 
     73 
     74 <h2 id="ColorPalette"> </h2>
     75 
     76 <p style="margin-bottom:30px">               .
     77 </p>
     78 
     79 <pre>
     80 &lt;resources>
     81   &lt;!-- inherit from the material theme -->
     82   &lt;style name="AppTheme" parent="android:Theme.Material">
     83     &lt;!-- Main theme colors -->
     84     &lt;!--   your app branding color for the app bar -->
     85     &lt;item name="android:colorPrimary">@color/primary&lt;/item>
     86     &lt;!--   darker variant for the status bar and contextual app bars -->
     87     &lt;item name="android:colorPrimaryDark">@color/primary_dark&lt;/item>
     88     &lt;!--   theme UI controls like checkboxes and text fields -->
     89     &lt;item name="android:colorAccent">@color/accent&lt;/item>
     90   &lt;/style>
     91 &lt;/resources>
     92 </pre>
     93 
     94 <div style="float:right;margin-left:25px;margin-top:20px;margin-bottom:10px" id="fig3">
     95 <img src="{@docRoot}training/material/images/ThemeColors.png" width="250" height="445" />
     96 <p class="img-caption" style="margin-bottom:0px">
     97 <strong> 3.</strong>   </p>
     98 </div>
     99 
    100 
    101 <h2 id="StatusBar">  </h2>
    102 
    103 <p>        .              .
    104           <code>android:statusBarColor</code>  .
    105 
    106   <code>android:statusBarColor</code> <code>android:colorPrimaryDark</code>  .
    107 </p>
    108 
    109 <p>      .         ,        .
    110 
    111    <code>android:statusBarColor</code> 
    112 <code>&#64;android:color/transparent</code>      .  {@link android.view.Window#setStatusBarColor Window.setStatusBarColor()}         .
    113 
    114 </p>
    115 
    116 <p class="note">
    117 <strong>:</strong>          . ,                  .
    118 
    119 
    120 </p>
    121 
    122 <p>     ,       .
    123          .</p>
    124 
    125 
    126 <h2 id="Inheritance">   </h3>
    127 
    128 <p>XML        <code>android:theme</code>    .
    129         ,        .
    130 
    131 </p>
    132