Click RecyclerView, move to the center, and click recyclerview.

Source: Internet
Author: User

Click RecyclerView, move to the center, and click recyclerview.

This blog introduces how to add a click event to RecyclerView, click an item, and the clicked item can be moved to the intermediate position.

For example, if we click the item 0-28 on the right, the item will automatically slide to the middle position. The effect is as follows:

What is the specific implementation process? (The use of RecyclerView has been introduced in the previous blog. I will not go into details here .)

First, in the adapter of RecyclerView, we define an OnItemClickListener interface and onBindViewHolder () method to add a click event to the item. The sample code is as follows:

Package com. li. recyclerviewdemo; import java. util. arrayList; import java. util. list; import android. content. context; import android. support. v7.widget. recyclerView; import android. view. layoutInflater; import android. view. view; import android. view. view. onClickListener; import android. view. viewGroup; import android. widget. textView; public class RvAdapter extends RecyclerView. adapter
 
  
{Private Context context; private List
  
   
Datas; private RvAdapter. OnItemClickListener onItemClickListener; // used to mark the position of the clicked item, so that you can set the background color private List.
   
    
PosList = new ArrayList
    
     
(); Public RvAdapter (Context context, List
     
      
Datas) {super (); this. context = context; this. datas = datas;} public void setOnItemClickListener (RvAdapter. onItemClickListener listener) {this. onItemClickListener = listener;} @ Override public int getItemCount () {return datas = null? 0: datas. size () ;}@ Override public void onBindViewHolder (final ViewHolder holder, int pos) {TestBeans bean = datas. get (pos); holder. tvDate. setText (bean. getDateMd (); holder. tvDay. setText (bean. getDateDay (); holder. tvPrice. setText (bean. getPrice (); // sets the callback of the Click Event holder. itemView. setOnClickListener (new OnClickListener () {@ Override public void onClick (View v) {if (onItemClickListener! = Null) {int position = holder. getPosition (); onItemClickListener. onItemClick (holder. itemView, position); // mark the position of the clicked item posList. clear (); posList. add (position) ;}}); if (posList. contains (pos) {holder. itemView. setBackgroundColor (context. getResources (). getColor (R. color. green);} else {holder. itemView. setBackgroundColor (context. getResources (). getColor (R. color. gray) ;}@ Override public ViewHolder onCreateViewHolder (ViewGroup arg0, int arg1) {View v = LayoutInflater. from (arg0.getContext ()). inflate (R. layout. rv_adapter_item, arg0, false); ViewHolder h_= new ViewHolder (v); return FLAC;} public static class ViewHolder extends RecyclerView. viewHolder {TextView tvDate; TextView tvDay; TextView tvPrice; public ViewHolder (View itemView) {super (itemView); tvDate = (TextView) itemView. findViewById (R. id. tvDate); tvDay = (TextView) itemView. findViewById (R. id. tvDay); tvPrice = (TextView) itemView. findViewById (R. id. tvPrice) ;}}/*** custom Click Event interface * @ author lish */public interface OnItemClickListener {void onItemClick (View view, int position ); // void onItemLongClick (View view, int position); // long press }}
     
    
   
  
 

In MainActivity. java, the adapter adds a click event and moves the clicked item to the center position.

adapter.setOnItemClickListener(new OnItemClickListener() {            @Override            public void onItemClick(View view, int position) {                Toast.makeText(MainActivity.this, "-->" + position, Toast.LENGTH_SHORT).show();                moveToMiddle(view);                adapter.notifyDataSetChanged();            }        });

How to move a View:

/*** Scroll to the center position * @ param clkView the clicked View */public void moveToMiddle (View clkView) {int itemWidth = clkView. getWidth (); int screenWidth = getResources (). getDisplayMetrics (). widthPixels; int scrollWidth = clkView. getLeft ()-(screenWidth/2-itemWidth/2); rvView. scrollBy (scrollWidth, 0 );}

Basic Principle of moving to the center position: Calculate the screen width screenWidth, the width itemWidth of the clicked View, and the distance from the clicked View to the left is clkView. getLeft (), the width to be moved is clkView. getLeft ()-(screenWidth/2-itemWidth/2 );

The distance calculation is clear after you draw a picture on the paper. It is a bit ugly, but it can explain the problem and think about it more clearly.

The complete sample code is as follows:

Package com. li. recyclerviewdemo; import java. text. simpleDateFormat; import java. util. arrayList; import java. util. calendar; import java. util. date; import java. util. list; import java. util. locale; import com. li. recyclerviewdemo. rvAdapter. onItemClickListener; import android. app. activity; import android. OS. bundle; import android. support. v7.widget. linearLayoutManager; import android. support. v7.widget. recyclerView; import android. view. view; import android. widget. toast; public class MainActivity extends Activity {private RecyclerView rvView; private LinearLayoutManager layoutManager; private RvAdapter adapter; private List
 
  
BeanList = new ArrayList
  
   
(); @ Override protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); getDatas (); initView ();} private void initView () {rvView = (RecyclerView) findViewById (R. id. rvView); layoutManager = new LinearLayoutManager (this); layoutManager. setOrientation (LinearLayoutManager. HORIZONTAL); rvView. setLayoutManager (layoutManager); adapter = new RvAdapter (this, beanList); rvView. setAdapter (adapter); adapter. setOnItemClickListener (new OnItemClickListener () {@ Override public void onItemClick (View view, int position) {Toast. makeText (MainActivity. this, "-->" + position, Toast. LENGTH_SHORT ). show (); moveToMiddle (view); adapter. notifyDataSetChanged () ;}}) ;}/ *** scroll to the center position * @ param clkView clicked View */public void moveToMiddle (View clkView) {int itemWidth = clkView. getWidth (); int screenWidth = getResources (). getDisplayMetrics (). widthPixels; int scrollWidth = clkView. getLeft ()-(screenWidth/2-itemWidth/2); rvView. scrollBy (scrollWidth, 0);} private void getDatas () {Calendar ar cal = Calendar ar. getInstance (Locale. CHINA); SimpleDateFormat sdfMd = new SimpleDateFormat ("MM-dd"); String [] dayNames = getResources (). getStringArray (R. array. week_day); for (int I = 0; I <15; I ++) {cal. add (Calendar. DAY_OF_MONTH, 1); Date date = cal. getTime (); String dateMd = sdfMd. format (date); int dayOfWeek = cal. get (Calendar. DAY_OF_WEEK)-1; if (dayOfWeek <0) {dayOfWeek = 0;} String day = dayNames [dayOfWeek]; TestBeans bean = new TestBeans (); bean. setDateMd (dateMd); bean. setDateDay (day); bean. setPrice ("¥" + (I + 1) * 100); beanList. add (bean );}}}
  
 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.