将边框添加到GridView中的ImageView

Question

如果再次单击相同的图像，单击图像并消失边框后，如何在GridView中的ImageView中添加边框？

gv_gridview.setOnItemClickListener(new OnItemClickListener() { 

     @Override 
     public void onItemClick(AdapterView<?> parent, View v, int position, long Id) { 
      // TODO Auto-generated method stub 
      Toast.makeText(getBaseContext(),"You clikced on "+position,Toast.LENGTH_SHORT).show(); 
      // gv_gridview.setSelected(true); 
      // gv_gridview.setDescendantFocusability(ViewGroup.FOCUS_AFTER_DESCENDANTS); 
      // gv_gridview.setDrawSelectorOnTop(true); 
     } 
    }); 

Answer 1

这是电网项目选择问题

我假设你的网格项目是ImageView的。

解决方案

找到工作示例项目位置：https://github.com/jskierbi/sample-gridview-select

1. 您需要CheckedImageView类添加到您的项目，所以网格视图可以检查的项目给你。

import android.content.Context; 
import android.util.AttributeSet; 
import android.widget.Checkable; 
import android.widget.ImageView; 

public class CheckedImageView extends ImageView implements Checkable { 

    boolean mFlgChecked = false; 

    private static final int[] CHECKED_STATE_SET = { 
      android.R.attr.state_checked 
    }; 

    public CheckedImageView(Context context, AttributeSet attrs) { 

     super(context, attrs); 
    } 

    @Override 
    public int[] onCreateDrawableState(int extraSpace) { 

     final int[] drawableState = super.onCreateDrawableState(extraSpace + 1); 
     if (isChecked()) { 
      mergeDrawableStates(drawableState, CHECKED_STATE_SET); 
     } 
     return drawableState; 
    } 

    @Override 
    public boolean isChecked() { 

     return mFlgChecked; 
    } 

    @Override 
    public void setChecked(boolean checked) { 

     mFlgChecked = checked; 
     refreshDrawableState(); 
    } 

    @Override 
    public void toggle() { 

     mFlgChecked = !mFlgChecked; 
    } 
} 

2.添加颜色（RES /值/ colors.xml）：

<?xml version="1.0" encoding="utf-8"?> 
<resources> 

    <color name="image_selected">#0000FF</color> 
    <color name="transparent">#00000000</color> 

</resources> 

加法选择，这将定义哪种颜色被用于该图像的状态（RES /抽拉/ checked_image.xml）：

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 

    <item android:state_checked="true" android:drawable="@color/image_selected" /> 
    <item android:drawable="@color/transparent" /> 

</selector> 

添加网格项目布局（res/layout/grid_view_item.xml）

记住要更改com.example.CheckedImageView程序包名称，以便它反映您放置CheckedImageView类的位置。

<?xml version="1.0" encoding="utf-8"?> 
<com.example.CheckedImageView android:id="@+id/image" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@drawable/checked_image" 
    android:cropToPadding="true" 
    android:padding="6dp" /> 

最后，使用此布局中适配器。下面是我的Activity类全码：

import android.app.Activity; 
import android.os.Bundle; 
import android.support.annotation.DrawableRes; 
import android.util.Log; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.BaseAdapter; 
import android.widget.GridView; 
import android.widget.ImageView; 


public class MainActivity extends Activity { 

    private static final @DrawableRes int[] IMAGES = { 
      R.drawable.a001, R.drawable.a002, R.drawable.a003, R.drawable.a004, R.drawable.a005, 
      R.drawable.a006, R.drawable.a007, R.drawable.a008, R.drawable.a009, R.drawable.a010, 
      R.drawable.a011, R.drawable.a012, R.drawable.a013, R.drawable.a014, R.drawable.a015, 
      R.drawable.a016, R.drawable.a017, R.drawable.a018 
    }; 

    private GridView mGridView; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     mGridView = ((GridView) findViewById(R.id.gridview)); 
     mGridView.setChoiceMode(GridView.CHOICE_MODE_SINGLE); 
     mGridView.setAdapter(new BaseAdapter() { 
      @Override public int getCount() { 
       return IMAGES.length; 
      } 
      @Override public Object getItem(int position) { 
       return IMAGES[position]; 
      } 
      @Override public long getItemId(int position) { 
       return IMAGES[position]; 
      } 
      @Override public View getView(int position, View convertView, ViewGroup parent) { 
       if (convertView == null || !(convertView instanceof ImageView)) { 
        ImageView imageView = (ImageView) getLayoutInflater().inflate(R.layout.grid_view_item, parent, false); 
        imageView.setImageResource(IMAGES[position]); 
        convertView = imageView; 
       } 
       return convertView; 
      } 
     }); 
    } 
} 

最后，你可以使用mGridView.getCheckedItemPosition()得到检查项目的位置。

屏幕：