Wie man Cardview nach Material Design in Android machen?

Ich sah Material Design-Richtlinien in Bezug auf aber es wenig Verwirrung, während ich meine Karte mit Bild auf der linken Seite und etwas Text auf der rechten Seite von Image.Aber ich habe nicht zufrieden, ob es nach der Richtlinie oder nicht ... ist überprüfe und erzähle. und ich möchte auch meinen Dummy-Text-Absatz zu rechtfertigen.Wie man Cardview nach Material Design in Android machen?

hier mein Code: -

<android.support.v7.widget.CardView 
style="@style/MyCardViewStyle" 
xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:clipToPadding="false" 
> 

<RelativeLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" 
    > 

    <ImageView 
     android:id="@+id/appImage" 
     android:layout_width="72dp" 
     android:layout_height="72dp" 
     android:layout_marginLeft="16dp" 
     android:background="@drawable/video" 
     android:scaleType="centerCrop" 
     tools:ignore="ContentDescription"/> 

    <TextView 
     android:id="@+id/headingText" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@+id/appImage" 
     android:paddingLeft="16sp" 
     android:paddingRight="16dp" 
     android:text="Title" 
     android:textColor="#000" 
     android:textSize="18sp" 
     tools:ignore="RtlHardcoded"/> 

    <TextView 
     android:id="@+id/subHeaderText" 
     style="@style/Base.TextAppearance.AppCompat.Subhead" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/headingText" 
     android:layout_toRightOf="@+id/appImage" 
     android:paddingLeft="16dp" 
     android:text="SubTiltle" 
     android:paddingRight="16dp" 
     android:textColor="#000" 
     android:textSize="15sp"/> 

    <TextView 
     android:id="@+id/subHeadingText" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/subHeaderText" 
     android:layout_toRightOf="@+id/appImage" 
     android:gravity="left" 
     android:lines="5" 
     android:maxLines="5" 
     android:paddingBottom="16dp" 
     android:paddingLeft="16dp" 
     android:paddingTop="16dp" 
     android:text="@string/stories_detail" 
     android:textColor="#737078" 
     android:textSize="14sp"/> 

    <Button 
     android:id="@+id/getDealBtn" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/subHeadingText" 
     android:background="@drawable/get_deal_button" 
     android:elevation="2dp" 
     android:textAllCaps="true" 
     android:textColor="#FFFF" 
     android:textSize="14sp" 
     android:textStyle="bold"/> 

</RelativeLayout>

und hier ist mein cardview wie folgt aussieht: -

Quelle

2016-05-18 Rajesh

Wie möchten Sie? Kannst du einen Screenshot zeigen? –

Haben Sie Ihren vollständigen XML-Code hier veröffentlicht .. ?? Weil es unvollständig aussieht, weil das Kartenansichts-Tag am Ende nicht geschlossen ist. dh "" und auch "card_view: cardCornerRadius =" 4dp " –

einbeziehen, müssen Sie die Kartenhöhe richtig verwenden und eine runde Ecke, um wie Material auszusehen. –

Verwendung dieser.

<android.support.v7.widget.CardView 
    android:id="@+id/cardView" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_margin="2dp" 
    card_view:cardBackgroundColor="#fff" 
    card_view:cardCornerRadius="5dp" 
    card_view:cardElevation="4dp" 

    card_view:cardUseCompatPadding="true" 
    xmlns:tools="http://schemas.android.com/tools"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="vertical" 
     android:background="@color/white" 

     > 

     <ImageView 
      android:id="@+id/appImage" 
      android:layout_width="72dp" 
      android:layout_height="72dp" 
      android:layout_marginLeft="16dp" 
      android:background="@drawable/img_android" 
      android:scaleType="centerCrop" 
      tools:ignore="ContentDescription"/> 

     <TextView 
      android:id="@+id/headingText" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_toRightOf="@+id/appImage" 
      android:paddingLeft="16sp" 
      android:paddingRight="16dp" 
      android:text="Title" 
      android:textColor="#000" 
      android:textSize="18sp" 
      tools:ignore="RtlHardcoded"/> 

     <TextView 
      android:id="@+id/subHeaderText" 
      style="@style/Base.TextAppearance.AppCompat.Subhead" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/headingText" 
      android:layout_toRightOf="@+id/appImage" 
      android:paddingLeft="16dp" 
      android:text="SubTiltle" 
      android:paddingRight="16dp" 
      android:textColor="#000" 
      android:textSize="15sp"/> 

     <TextView 
      android:id="@+id/subHeadingText" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/subHeaderText" 
      android:layout_toRightOf="@+id/appImage" 
      android:gravity="left" 
      android:lines="5" 
      android:maxLines="5" 
      android:paddingBottom="16dp" 
      android:paddingLeft="16dp" 
      android:paddingTop="16dp" 
      android:text="stories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detailstories_detail" 
      android:textColor="#737078" 
      android:textSize="14sp"/> 

     <Button 
      style="@style/Base.Widget.AppCompat.Button.Borderless" 
      android:id="@+id/getDealBtn" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@id/subHeadingText" 
      android:textColor="#FFFFFF" 
      android:background="@color/clrDarkGreen" 
      android:textSize="14sp" 
      android:textStyle="bold" 
      android:text="Button"/> 

    </RelativeLayout> 
    </android.support.v7.widget.CardView>ort.v7.widget.CardView>

Quelle

2016-05-18 05:00:26

// Add Stil wie pro Ihre Anforderung

<android.support.v7.widget.CardView 
xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:clipToPadding="false"> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="horizontal"> 

     <ImageView 
      android:id="@+id/appImage" 
      android:layout_width="72dp" 
      android:layout_height="72dp" 
      android:layout_marginLeft="16dp" 
      android:scaleType="centerCrop" 
      tools:ignore="ContentDescription" 
      android:layout_margin="10dp"/> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:orientation="vertical"> 

      <TextView 
      android:id="@+id/headingText" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_toRightOf="@+id/appImage" 
      android:paddingLeft="16sp" 
      android:paddingRight="16dp" 
      android:text="Title" 
      android:textColor="#000" 
      android:textSize="18sp" 
      tools:ignore="RtlHardcoded"/> 

      <TextView 
       android:id="@+id/subHeaderText" 
       style="@style/Base.TextAppearance.AppCompat.Subhead" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_below="@+id/headingText" 
       android:layout_toRightOf="@+id/appImage" 
       android:paddingLeft="16dp" 
       android:text="SubTiltle" 
       android:paddingRight="16dp" 
       android:textColor="#000" 
       android:textSize="15sp" 
       android:layout_marginTop="20dp"/> 


      <TextView 
       android:id="@+id/subHeadingText" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:gravity="left" 
      android:lines="5" 
      android:maxLines="5" 
      android:paddingBottom="16dp" 
      android:paddingLeft="16dp" 
      android:paddingTop="16dp" 
      android:textColor="#737078" 
      android:textSize="14sp" 
      android:layout_marginTop="20dp"/> 

     </LinearLayout> 

    </LinearLayout> 

    <Button 
     android:id="@+id/getDealBtn" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:elevation="2dp" 
     android:textAllCaps="true" 
     android:textColor="#FFFF" 
     android:textSize="14sp" 
     android:textStyle="bold"/> 

</LinearLayout>

Quelle

2016-05-18 05:04:14

Hier wird das Projekt link auf GitHub ist mit CardView Layouts in Übereinstimmung mit Material Design-Richtlinien umgesetzt werden.

Quelle

2017-10-09 19:17:57

Wie man Cardview nach Material Design in Android machen?

Antwort

Verwandte Themen