Space 我的组件中的错误
Space bug in my component
我几乎成功地用 RecyclerView 和 GridLayoutManager 构建了一个棋盘组件,其中坐标单元格的尺寸是单元格尺寸的一半。但不知道为什么,左边坐标区和第一个单元格列("a"列)之间有一个垂直间隙。
这样做的原因是将单元格管理为 ImageView,以便我可以使用像 Glide 这样的库。
MainActivity.java :
package com.loloof64.recycler_view_test;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
activity_main.xml布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.loloof64.recycler_view_test.MainActivity">
<com.loloof64.recycler_view_test.BoardComponent
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
BoardComponent.java :
package com.loloof64.recycler_view_test;
import android.content.Context;
import android.support.annotation.Nullable;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.AttributeSet;
public class BoardComponent extends RecyclerView {
public BoardComponent(Context context) {
super(context);
initialize(context);
}
public BoardComponent(Context context, @Nullable AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
initialize(context);
}
public BoardComponent(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
initialize(context);
}
private void initialize(Context context){
setLayoutManager(new GridLayoutManager(context, BoardComponentAdapter.ITEMS_PER_ROW));
setAdapter(new BoardComponentAdapter(context));
}
}
BoardComponentAdapter.java :
package com.loloof64.recycler_view_test;
import android.content.Context;
import android.graphics.Color;
import android.support.v7.widget.RecyclerView;
import android.util.TypedValue;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.RelativeLayout;
public class BoardComponentAdapter extends RecyclerView.Adapter<BoardComponentViewHolder> {
public final static int ITEMS_PER_ROW = 10;
public final static int TOTAL_ITEMS = ITEMS_PER_ROW * ITEMS_PER_ROW;
private final static int CELL_SIZE_DP = 20;
private int cellSizePx;
public BoardComponentAdapter(Context context){
cellSizePx = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CELL_SIZE_DP, context.getResources().getDisplayMetrics());
}
@Override
public BoardComponentViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.board_component, parent, false);
return new BoardComponentViewHolder(itemView);
}
@Override
public void onBindViewHolder(BoardComponentViewHolder holder, int position) {
int rowPosition = position / ITEMS_PER_ROW;
int colPosition = position % ITEMS_PER_ROW;
boolean isACellRow = rowPosition > 0 && rowPosition < (ITEMS_PER_ROW-1);
boolean isACellCol = colPosition > 0 && colPosition < (ITEMS_PER_ROW-1);
if (isACellCol && isACellRow){
int color = (rowPosition+colPosition) % 2 == 0 ? Color.rgb(255,180, 35) : Color.rgb(128,41,21);
holder.imageView.setBackgroundColor(color);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellSizePx, cellSizePx);
holder.imageView.setLayoutParams(layoutParams);
}
else {
int cellWidth = isACellCol ? cellSizePx : cellSizePx/2;
int cellHeight = isACellRow ? cellSizePx : cellSizePx/2;
holder.imageView.setBackgroundColor(Color.rgb(191,96,123));
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellWidth, cellHeight);
holder.imageView.setLayoutParams(layoutParams);
}
}
@Override
public int getItemCount() {
return TOTAL_ITEMS;
}
}
BoardComponentViewHolder.java
package com.loloof64.recycler_view_test;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.ImageView;
public class BoardComponentViewHolder extends RecyclerView.ViewHolder {
public ImageView imageView;
public BoardComponentViewHolder(View itemView) {
super(itemView);
imageView = (ImageView) itemView.findViewById(R.id.cell_view);
}
}
board_component.xml布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/cell_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
问题:
It was happening because for border your are taking half of the height
and width as these parameters got half, The half place is there
unfilled i.e. why you are seeing GAP.
解法:
You can leave left margin equal to your cell width and the gap
will be gone..!! But just for the first column as you are having problem in first column only..!!
试过你的代码。刚刚对您的 BoardComponentAdapter.java
进行了更改并且对我来说工作正常。请参阅以下更改:
@Override
public void onBindViewHolder(BoardComponentViewHolder holder, int position) {
int rowPosition = position / ITEMS_PER_ROW;
int colPosition = position % ITEMS_PER_ROW;
boolean isACellRow = rowPosition > 0 && rowPosition < (ITEMS_PER_ROW-1);
boolean isACellCol = colPosition > 0 && colPosition < (ITEMS_PER_ROW-1);
if (isACellCol && isACellRow){
int color = (rowPosition+colPosition) % 2 == 0 ? Color.rgb(255,180, 35) : Color.rgb(128,41,21);
holder.imageView.setBackgroundColor(color);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellSizePx, cellSizePx);
holder.imageView.setLayoutParams(layoutParams);
}
else
{
int cellWidth = isACellCol ? cellSizePx : cellSizePx / 2;
int cellHeight = isACellRow ? cellSizePx : cellSizePx / 2;
holder.imageView.setBackgroundColor(Color.rgb(191, 96, 123));
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellWidth, cellHeight);
//Just Added three lines here..!!
if(colPosition==0) {
layoutParams.setMargins(cellWidth,0,0,0);
}
holder.imageView.setLayoutParams(layoutParams);
}
}
我几乎成功地用 RecyclerView 和 GridLayoutManager 构建了一个棋盘组件,其中坐标单元格的尺寸是单元格尺寸的一半。但不知道为什么,左边坐标区和第一个单元格列("a"列)之间有一个垂直间隙。
这样做的原因是将单元格管理为 ImageView,以便我可以使用像 Glide 这样的库。
MainActivity.java :
package com.loloof64.recycler_view_test;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
activity_main.xml布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.loloof64.recycler_view_test.MainActivity">
<com.loloof64.recycler_view_test.BoardComponent
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
BoardComponent.java :
package com.loloof64.recycler_view_test;
import android.content.Context;
import android.support.annotation.Nullable;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.AttributeSet;
public class BoardComponent extends RecyclerView {
public BoardComponent(Context context) {
super(context);
initialize(context);
}
public BoardComponent(Context context, @Nullable AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
initialize(context);
}
public BoardComponent(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
initialize(context);
}
private void initialize(Context context){
setLayoutManager(new GridLayoutManager(context, BoardComponentAdapter.ITEMS_PER_ROW));
setAdapter(new BoardComponentAdapter(context));
}
}
BoardComponentAdapter.java :
package com.loloof64.recycler_view_test;
import android.content.Context;
import android.graphics.Color;
import android.support.v7.widget.RecyclerView;
import android.util.TypedValue;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.RelativeLayout;
public class BoardComponentAdapter extends RecyclerView.Adapter<BoardComponentViewHolder> {
public final static int ITEMS_PER_ROW = 10;
public final static int TOTAL_ITEMS = ITEMS_PER_ROW * ITEMS_PER_ROW;
private final static int CELL_SIZE_DP = 20;
private int cellSizePx;
public BoardComponentAdapter(Context context){
cellSizePx = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CELL_SIZE_DP, context.getResources().getDisplayMetrics());
}
@Override
public BoardComponentViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.board_component, parent, false);
return new BoardComponentViewHolder(itemView);
}
@Override
public void onBindViewHolder(BoardComponentViewHolder holder, int position) {
int rowPosition = position / ITEMS_PER_ROW;
int colPosition = position % ITEMS_PER_ROW;
boolean isACellRow = rowPosition > 0 && rowPosition < (ITEMS_PER_ROW-1);
boolean isACellCol = colPosition > 0 && colPosition < (ITEMS_PER_ROW-1);
if (isACellCol && isACellRow){
int color = (rowPosition+colPosition) % 2 == 0 ? Color.rgb(255,180, 35) : Color.rgb(128,41,21);
holder.imageView.setBackgroundColor(color);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellSizePx, cellSizePx);
holder.imageView.setLayoutParams(layoutParams);
}
else {
int cellWidth = isACellCol ? cellSizePx : cellSizePx/2;
int cellHeight = isACellRow ? cellSizePx : cellSizePx/2;
holder.imageView.setBackgroundColor(Color.rgb(191,96,123));
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellWidth, cellHeight);
holder.imageView.setLayoutParams(layoutParams);
}
}
@Override
public int getItemCount() {
return TOTAL_ITEMS;
}
}
BoardComponentViewHolder.java
package com.loloof64.recycler_view_test;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.ImageView;
public class BoardComponentViewHolder extends RecyclerView.ViewHolder {
public ImageView imageView;
public BoardComponentViewHolder(View itemView) {
super(itemView);
imageView = (ImageView) itemView.findViewById(R.id.cell_view);
}
}
board_component.xml布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/cell_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
问题:
It was happening because for border your are taking half of the height and width as these parameters got half, The half place is there unfilled i.e. why you are seeing GAP.
解法:
You can leave left margin equal to your cell width and the gap will be gone..!! But just for the first column as you are having problem in first column only..!!
试过你的代码。刚刚对您的 BoardComponentAdapter.java
进行了更改并且对我来说工作正常。请参阅以下更改:
@Override
public void onBindViewHolder(BoardComponentViewHolder holder, int position) {
int rowPosition = position / ITEMS_PER_ROW;
int colPosition = position % ITEMS_PER_ROW;
boolean isACellRow = rowPosition > 0 && rowPosition < (ITEMS_PER_ROW-1);
boolean isACellCol = colPosition > 0 && colPosition < (ITEMS_PER_ROW-1);
if (isACellCol && isACellRow){
int color = (rowPosition+colPosition) % 2 == 0 ? Color.rgb(255,180, 35) : Color.rgb(128,41,21);
holder.imageView.setBackgroundColor(color);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellSizePx, cellSizePx);
holder.imageView.setLayoutParams(layoutParams);
}
else
{
int cellWidth = isACellCol ? cellSizePx : cellSizePx / 2;
int cellHeight = isACellRow ? cellSizePx : cellSizePx / 2;
holder.imageView.setBackgroundColor(Color.rgb(191, 96, 123));
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(cellWidth, cellHeight);
//Just Added three lines here..!!
if(colPosition==0) {
layoutParams.setMargins(cellWidth,0,0,0);
}
holder.imageView.setLayoutParams(layoutParams);
}
}