Table 排行榜模板的布局 xml - Android
Table layout xml for leaderboard template - Android
我正在尝试为用户排行榜创建布局,但我不知道如何使每一“行”的比例相等。
以下是用户列表:
这是子布局(填充回收视图)的代码:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/topUsersLeaderboardItem_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="12"
android:orientation="horizontal"
android:paddingBottom="@dimen/margin_extra_small"
android:paddingTop="@dimen/margin_extra_small">
<TextView
android:id="@+id/topUsersLeaderboardItem_position"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:paddingStart="@dimen/margin_small"
android:textColor="@color/colorBlack"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:textSize="@dimen/font_size_small"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="8">
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_layoutPicUser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<ImageView
android:id="@+id/topUsersLeaderboardItem_userIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:src="@drawable/circular_profile"
app:srcCompat="@drawable/circular_profile" />
<TextView
android:id="@+id/topUsersLeaderboardItem_userInitial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal|center"
android:text="U"
android:textSize="@dimen/font_size_medium"/>
</RelativeLayout>
<TextView
android:id="@+id/topUsersLeaderboardItem_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal"
android:text="uername"
android:textColor="@color/colorBlack"
android:layout_marginStart="8dp"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_layoutPicUser"
android:textSize="@dimen/font_size_small"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_scoreLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2"
android:gravity="end">
<TextView
android:id="@+id/topUsersLeaderboardItem_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:text="150"
android:textSize="@dimen/font_size_small"
android:textColor="@color/colorBlack" />
<ImageView
android:id="@+id/topUsersLeaderboardItem_starImage"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="false"
android:layout_centerVertical="true"
android:layout_marginEnd="@dimen/margin_small"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_score"
android:src="@drawable/ic_star_yellow_24dp"
app:srcCompat="@drawable/ic_star_yellow_24dp" />
</RelativeLayout>
从图中可以看出,左边的数字所取的space在我想固定的时候增加了。有没有办法制作这种“table 布局”?谢谢大家!
请使用这个
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/topUsersLeaderboardItem_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="12"
android:orientation="horizontal"
android:paddingBottom="@dimen/margin_extra_small"
android:paddingTop="@dimen/margin_extra_small">
<TextView
android:id="@+id/topUsersLeaderboardItem_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="0"
android:paddingStart="@dimen/margin_small"
android:textColor="@color/colorBlack"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:textSize="@dimen/font_size_small"/>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="8">
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_layoutPicUser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<ImageView
android:id="@+id/topUsersLeaderboardItem_userIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:src="@drawable/circular_profile"
app:srcCompat="@drawable/circular_profile" />
<TextView
android:id="@+id/topUsersLeaderboardItem_userInitial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal|center"
android:text="U"
android:textSize="@dimen/font_size_medium"/>
</RelativeLayout>
<TextView
android:id="@+id/topUsersLeaderboardItem_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal"
android:text="uername"
android:textColor="@color/colorBlack"
android:layout_marginStart="8dp"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_layoutPicUser"
android:textSize="@dimen/font_size_small"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_scoreLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2">
<TextView
android:id="@+id/topUsersLeaderboardItem_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:text="150"
android:textSize="@dimen/font_size_small"
android:textColor="@color/colorBlack" />
<ImageView
android:id="@+id/topUsersLeaderboardItem_starImage"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="false"
android:layout_centerVertical="true"
android:layout_marginEnd="@dimen/margin_small"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_score"
android:src="@drawable/ic_star_yellow_24dp"
app:srcCompat="@drawable/ic_star_yellow_24dp" />
</RelativeLayout>
其实是因为android:layout_width="wrap_content"
第一个 TextView,给它一些预定义的值,比如 android:layout_width="10dp"
。不要忘记从 TextView 中移除引力。
我正在尝试为用户排行榜创建布局,但我不知道如何使每一“行”的比例相等。
以下是用户列表:
这是子布局(填充回收视图)的代码:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/topUsersLeaderboardItem_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="12"
android:orientation="horizontal"
android:paddingBottom="@dimen/margin_extra_small"
android:paddingTop="@dimen/margin_extra_small">
<TextView
android:id="@+id/topUsersLeaderboardItem_position"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:paddingStart="@dimen/margin_small"
android:textColor="@color/colorBlack"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:textSize="@dimen/font_size_small"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="8">
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_layoutPicUser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<ImageView
android:id="@+id/topUsersLeaderboardItem_userIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:src="@drawable/circular_profile"
app:srcCompat="@drawable/circular_profile" />
<TextView
android:id="@+id/topUsersLeaderboardItem_userInitial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal|center"
android:text="U"
android:textSize="@dimen/font_size_medium"/>
</RelativeLayout>
<TextView
android:id="@+id/topUsersLeaderboardItem_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal"
android:text="uername"
android:textColor="@color/colorBlack"
android:layout_marginStart="8dp"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_layoutPicUser"
android:textSize="@dimen/font_size_small"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_scoreLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2"
android:gravity="end">
<TextView
android:id="@+id/topUsersLeaderboardItem_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:text="150"
android:textSize="@dimen/font_size_small"
android:textColor="@color/colorBlack" />
<ImageView
android:id="@+id/topUsersLeaderboardItem_starImage"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="false"
android:layout_centerVertical="true"
android:layout_marginEnd="@dimen/margin_small"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_score"
android:src="@drawable/ic_star_yellow_24dp"
app:srcCompat="@drawable/ic_star_yellow_24dp" />
</RelativeLayout>
从图中可以看出,左边的数字所取的space在我想固定的时候增加了。有没有办法制作这种“table 布局”?谢谢大家!
请使用这个
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/topUsersLeaderboardItem_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="12"
android:orientation="horizontal"
android:paddingBottom="@dimen/margin_extra_small"
android:paddingTop="@dimen/margin_extra_small">
<TextView
android:id="@+id/topUsersLeaderboardItem_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="0"
android:paddingStart="@dimen/margin_small"
android:textColor="@color/colorBlack"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:textSize="@dimen/font_size_small"/>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="8">
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_layoutPicUser"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical">
<ImageView
android:id="@+id/topUsersLeaderboardItem_userIcon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerHorizontal="true"
android:src="@drawable/circular_profile"
app:srcCompat="@drawable/circular_profile" />
<TextView
android:id="@+id/topUsersLeaderboardItem_userInitial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal|center"
android:text="U"
android:textSize="@dimen/font_size_medium"/>
</RelativeLayout>
<TextView
android:id="@+id/topUsersLeaderboardItem_username"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_centerVertical="true"
android:gravity="center_vertical|center_horizontal"
android:text="uername"
android:textColor="@color/colorBlack"
android:layout_marginStart="8dp"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_layoutPicUser"
android:textSize="@dimen/font_size_small"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/topUsersLeaderboardItem_scoreLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2">
<TextView
android:id="@+id/topUsersLeaderboardItem_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:text="150"
android:textSize="@dimen/font_size_small"
android:textColor="@color/colorBlack" />
<ImageView
android:id="@+id/topUsersLeaderboardItem_starImage"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentEnd="false"
android:layout_centerVertical="true"
android:layout_marginEnd="@dimen/margin_small"
android:layout_toEndOf="@+id/topUsersLeaderboardItem_score"
android:src="@drawable/ic_star_yellow_24dp"
app:srcCompat="@drawable/ic_star_yellow_24dp" />
</RelativeLayout>
其实是因为android:layout_width="wrap_content"
第一个 TextView,给它一些预定义的值,比如 android:layout_width="10dp"
。不要忘记从 TextView 中移除引力。