I have been battling with GridLayout and TableLayout for the past couple of hours and for the life of me can't figure out a way to make a CardView that looks like the following:
Currently I have a CardView parent with this GridLayout is its child:
<GridLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:rowCount="3"
android:columnCount="3"
android:orientation="horizontal"
android:padding="20dp">
<!--FirstRow-->
<ImageView
android:id="@+id/away_logo"
android:layout_row="1"
android:layout_column="0"
android:layout_columnWeight="0.3"
android:layout_gravity="start"
android:gravity="center_vertical"
android:src="@android:drawable/btn_star_big_on"/>
<LinearLayout
android:id="@+id/scores_layout"
android:layout_row="1"
android:layout_rowWeight="0.5"
android:layout_column="1"
android:layout_columnWeight="0.4"
android:layout_gravity="center"
android:orientation="horizontal">
<TextView
android:id="@+id/away_score_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="10"
android:gravity="center_vertical|start"
android:layout_weight="0.5"/>
<TextView
android:id="@+id/home_score_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|center_vertical"
android:text="11"
android:gravity="center_vertical|end"
android:layout_weight="0.5"/>
</LinearLayout>
<ImageView
android:id="@+id/home_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="1"
android:layout_rowWeight="0.33"
android:layout_column="2"
android:layout_columnWeight="0.3"
android:layout_gravity="start"
android:gravity="center_vertical"
android:src="@android:drawable/btn_star_big_on"/>
<!--SecondRow-->
<TextView
android:id="@+id/away_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="2"
android:layout_rowWeight="0.3"
android:layout_column="0"
android:layout_columnWeight="0.33"
android:layout_gravity="start"
android:text="Team"
android:gravity="center_vertical"/>
<TextView
android:id="@+id/home_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="2"
android:layout_rowWeight="0.3"
android:layout_column="2"
android:layout_columnWeight="0.33"
android:layout_gravity="end"
android:text="Team"
android:gravity="center_vertical"/>
<!--LastRow-->
<TextView
android:id="@+id/time_rink_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_rowWeight="0.3"
android:layout_column="0"
android:layout_columnSpan="3"
android:layout_columnWeight="1"
android:text="7:00P.M.atBotany"
android:layout_gravity="center_horizontal"/>
</GridLayout>
Which gives this layout where the stars are placeholders to visualise where the ImageViews are and the scores are 1 - 13:
Try this layout
<?xml version="1.0" encoding="utf-8"?>
<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="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="10dp"
tools:text="7:00 P.M. at Venue"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical"
android:padding="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
tools:src="@drawable/team_1_image"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="8dp"
tools:text="Team 1"/>
</LinearLayout>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
tools:text="1 - 3"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:orientation="vertical"
android:padding="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
tools:src="@drawable/team_2_image"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="8dp"
tools:text="Team 2"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
为什么不尝试使用相对布局来包含内部内容(也可以对标题进行处理),并根据父级,左,右和中心部分对齐视图,它应该适合您。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.