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>  
     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> API 
     46 {@link android.R.style R.style} </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.0API  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