我正在尝试创建 CardViews 的不同模式,将它们水平和垂直对齐并将它们放在一个大的 LinearLayout 中,以实现以下目的:
我已经创建了第一张和最后一张卡片视图,但是我在创建卡片视图之间遇到了麻烦,其中包括所有功能:垂直分割器,以及第一个和第二个之间的边缘切割水平分隔线cardviews。
(**红色剪刀和蓝色圆圈是png的)
我对任何其他可能完成这个简单的“GridView”xml代码的建议持开放态度。
我添加了我的xml代码:
execute_script
谢谢你的帮助。
答案 0 :(得分:1)
在努力使用 CardView , android:layout_below 并在 Vertical 和水平分割器上学习之后,我得到了解决方案。以下的Cardview(也可能在LinearLayout中)包含上面的模型:
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical"
android:id="@+id/MainFormThirdRow"
card_view:cardCornerRadius="0dp"
card_view:cardElevation="0dp"
card_view:contentPadding="10dp"
card_view:cardBackgroundColor="@android:color/white"
android:layout_below="@+id/Divider2">
<LinearLayout
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:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="horizontal">
<!--Cycle Name--> <!--Cycle Stage-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:gravity="center_vertical"
android:orientation="vertical">
<!--Cycle Name-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:id="@+id/textViewCycleName"
style="@style/Base.TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Current Cycle Name"
android:textColor="#6d6e70"
android:textSize="15dp"/>
<LinearLayout
android:id="@+id/tableRowIOMapping1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:padding="5dp">
<!--Cycle Image-->
<ImageView
android:id="@+id/CycleImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp">
</ImageView>
<TextView
android:id="@+id/editTextCycleName"
style="@style/Base.TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cycle Value"
android:textColor="#ff0000"
android:textSize="17dp"
android:paddingTop="5dp"
android:maxLines="2"
android:ellipsize="end"/>
</LinearLayout>
</LinearLayout>
<!--Divider-->
<View
android:layout_width="match_parent"
android:background="@drawable/HalfHorizontalDivider"
android:layout_height="1dp"/>
<!--Cycle Stage-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:id="@+id/textViewCycleStage"
style="@style/Base.TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cycle Stage"
android:textColor="#6d6e70"
android:textSize="15dp"
android:gravity="center_horizontal"/>
<LinearLayout
android:id="@+id/tableRowIOMapping1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:paddingLeft="30dp">
<TextView
android:id="@+id/editTextCycleStage"
style="@style/Base.TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cycle Stage Value"
android:textColor="#231f20"
android:textSize="15dp"
android:textStyle="bold"
android:ellipsize="end"/>
<!--Cycle Image-->
<WebView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/MyWebView"
android:layout_width="100dp"
android:layout_height="100dp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<!--Vertical Divider-->
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="@drawable/FullVerticalDivider"/>
<!--System Status--> <!--Door State--> <!--Cycle Error-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:layout_marginLeft="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="3"
android:gravity="center_vertical"
android:orientation="vertical">
<!--System Status-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:id="@+id/textViewSystemStatus"
style="@style/Base.TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="System Status"
android:textColor="#6d6e70"
android:textSize="15dp"/>
<TextView
android:id="@+id/editTextSystemStatus"
style="@style/Base.TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="System Value"
android:textColor="#ff0000"
android:textSize="20dp"
android:padding="5dp"
android:maxLines="2"
android:ellipsize="end"/>
</LinearLayout>
<!--Divider-->
<View
android:layout_width="match_parent"
android:background="@drawable/HalfHorizontalDivider"
android:layout_height="1dp"/>
<!--Door State-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:id="@+id/textViewDoorState"
style="@style/Base.TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Door State"
android:textColor="#6d6e70"
android:textSize="15dp"
android:ellipsize="end"
android:maxLines="1"/>
<TextView
android:id="@+id/editTextDoorState"
style="@style/Base.TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Door State Value"
android:textColor="#ff0000"
android:textSize="20dp"
android:padding="5dp"
android:ellipsize="end"/>
</LinearLayout>
<!--Divider-->
<View
android:layout_width="match_parent"
android:background="@drawable/HalfHorizontalDivider"
android:layout_height="1dp"/>
<!--Cycle Error-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:id="@+id/textViewCycleError"
style="@style/Base.TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#6d6e70"
android:textSize="15dp"/>
<TextView
android:id="@+id/editTextCycleError"
style="@style/Base.TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ff0000"
android:textSize="20dp"
android:padding="5dp"
android:ellipsize="end"
android:maxLines="1"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
垂直分隔线:
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<size android:width="1dp"/>
<solid android:color="#989898"/>
</shape>
水平分割器:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<solid android:color="@android:color/white" />
</shape>
</item>
<item
android:left="10dp"
android:right="10dp">
<shape android:shape="rectangle" >
<solid android:color="#989898"/>
</shape>
</item>
</layer-list>
我希望它会有用。