紙墨設計文檔: 卡片 Card

jopen 8年前發布 | 10K 次閱讀 安卓開發 Android開發 移動開發

在 谷歌官方的紙墨設計文檔 中介紹如下：

卡片是包含了一組相關信息，通過卡片顯示摘要信息，點擊該卡片可以進入詳情界面。

如何使用

  • 在項目的 build.gradle 文件中添加 appcompat 庫：

Java 

dependencies {  
  compile 'com.android.support:cardview-v7:X.X.X' // where X.X.X version
}
dependencies {  
  compile 'com.android.support:cardview-v7:X.X.X' // where X.X.X version
}
</div>

  • 在布局文件中使用 CardView

XHTML 

<android.support.v7.widget.CardView

    android:layout_width="match_parent"
    android:layout_height="200dp">



<TextView
    android:text="Hello World!"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>




</android.support.v7.widget.CardView></pre> 
   
<android.support.v7.widget.CardView  
    android:layout_width="match_parent"
    android:layout_height="200dp">
 
    <TextView
        android:text="Hello World!"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
 
</android.support.v7.widget.CardView>  
 
  </div>


如何修改樣式？
  
     
   
  •  在你的 styles.xml 中定義自定義樣式： 
    • 

  
 
   
 
    
 XHTML 


   
<style name="MyCardViewStyle" parent="Theme.AppCompat.Light">  
    <item name="cardCornerRadius">2dp</item>
    <item name="cardElevation">2dp</item>
    <item name="contentPaddingBottom">24dp</item>
    <item name="contentPaddingTop">24dp</item>
    <item name="contentPaddingLeft">16dp</item>
    <item name="contentPaddingRight">16dp</item>
    <item name="cardBackgroundColor">@color/indigo</item>
</style>
 
   
<stylename="MyCardViewStyle" parent="Theme.AppCompat.Light">  
    <itemname="cardCornerRadius">2dp</item>
    <itemname="cardElevation">2dp</item>
    <itemname="contentPaddingBottom">24dp</item>
    <itemname="contentPaddingTop">24dp</item>
    <itemname="contentPaddingLeft">16dp</item>
    <itemname="contentPaddingRight">16dp</item>
    <itemname="cardBackgroundColor">@color/indigo</item>
</style>  
 
  </div>


     
   
  • 通過 style 屬性來使用該theme
    • 

  
 
   
 
    
 XHTML 


   
<android.support.v7.widget.CardView  
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    style="@style/MyCardViewStyle">
 
   
<android.support.v7.widget.CardView  
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    style="@style/MyCardViewStyle">    
 
  </div>


</div>
 </div>


來自： http://blog.chengyunfeng.com/?p=841
                    

                    

                        
 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。

                        
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。

                        
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！

                        
                        
                    


                

                

                    

                        
相關經驗

                        
                    

                    

                        
相關資訊

                        
                    

                    

                        
相關文檔