Tuesday, August 4, 2015

Android Horizontal Staggeredgridview with PositiontoCenter

This post about Horizontal Staggeredgridview  with view to center position like pager.

when i have  developed application . i have requirement like tile view with on swipe view should be center to position.  then i tried and found solution.

See the below screen output will be like this.

Output



For this one i have used libray called lucasr https://github.com/lucasr/twoway-view/   and modified as per as my requirement.

Activity Code

package inf.vj.twowaystaggeredgridviewviewcenterposition;

import java.util.ArrayList;

import org.lucasr.twowayview.widget.DividerItemDecoration;
import org.lucasr.twowayview.widget.TwoWayView;


import com.squareup.picasso.Picasso;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;
import android.widget.AbsListView.OnScrollListener;

public class MainActivity extends Activity {
TwoWayView mRecyclerView;
ArrayList<NewsStructure> newsArrayLst = new ArrayList<NewsStructure>();
String[] strImageUrl = {"http://www.hdwallpapersos.com/wp-content/uploads/2014/08/Nature-HD-Wallpaper-1080p.jpg",
"https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQJfVFBg3wTps8lucZi1RJ_sDrNDlsWUn5v_CP3dTI-eWlqnedn",
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSnrFdFpG_70zp8RFPkuM7myrc6xkIVKS8aubXAvo_t3unbWuiJ",
"https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSuTV9Y9xYVvd0DHO7-gHht6O8tc343B5pa9kQnXMQbeyfQvwQF",
"https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcS5iTL5GeVCo2hlfCl9h1c8fBW7bF-2ZQ7hAuo6aNGzgpZgfELW",
"https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQJfVFBg3wTps8lucZi1RJ_sDrNDlsWUn5v_CP3dTI-eWlqnedn",
"http://www.hdwallpapersos.com/wp-content/uploads/2014/08/Nature-HD-Wallpaper-1080p.jpg",
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSnrFdFpG_70zp8RFPkuM7myrc6xkIVKS8aubXAvo_t3unbWuiJ",
"https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSuTV9Y9xYVvd0DHO7-gHht6O8tc343B5pa9kQnXMQbeyfQvwQF",
"https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcS5iTL5GeVCo2hlfCl9h1c8fBW7bF-2ZQ7hAuo6aNGzgpZgfELW"};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
       
        mRecyclerView = (TwoWayView) findViewById(R.id.list);
        mRecyclerView.setHasFixedSize(true);
        mRecyclerView.setLongClickable(false);
       mRecyclerView.setOrientation(org.lucasr.twowayview.TwoWayLayoutManager.Orientation.HORIZONTAL);
      
      
       for(int i =0; i< 10; i++){
       NewsStructure newsStr = new NewsStructure();
       newsStr.setmId(""+strImageUrl[i]);
       newsArrayLst.add(newsStr);
       }
       final Drawable divider = getResources().getDrawable(R.drawable.divider);
       mRecyclerView.addItemDecoration(new DividerItemDecoration(divider));
       ItemAdapter mAdapter = new ItemAdapter(MainActivity.this, mRecyclerView, R.layout.activity_main, newsArrayLst);
       mRecyclerView.setAdapter(mAdapter);
       mRecyclerView.setOnScrollListener(new RecyclerView.OnScrollListener() {
           @SuppressLint("NewApi") @Override
           public void onScrollStateChanged(RecyclerView recyclerView, int scrollState) {
            boolean pauseOnScroll = false; // or true
        boolean pauseOnFling = false; // or false
         final Picasso picasso = Picasso.with(MainActivity.this);
           switch (scrollState) {
case OnScrollListener.SCROLL_STATE_IDLE:
picasso.resumeTag("mylist");
break;
case OnScrollListener.SCROLL_STATE_TOUCH_SCROLL:
if (pauseOnScroll) {
picasso.pauseTag("mylist");
}
break;
case OnScrollListener.SCROLL_STATE_FLING:
if (pauseOnFling) {
picasso.pauseTag("mylist");
}
break;
}
          
          
           }

           @SuppressLint("NewApi") @Override
           public void onScrolled(RecyclerView recyclerView, int i, int i2) {
          
           }
       });
      
      
      
    }

}


Adapter
package inf.vj.twowaystaggeredgridviewviewcenterposition;

/*
 * Copyright (C) 2014 Lucas Rocha
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Typeface;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import org.lucasr.twowayview.TwoWayLayoutManager;
import org.lucasr.twowayview.widget.TwoWayView;
import org.lucasr.twowayview.widget.SpannableGridLayoutManager;
import org.lucasr.twowayview.widget.StaggeredGridLayoutManager;
import com.squareup.picasso.Picasso;

import java.util.ArrayList;
import java.util.List;

public class ItemAdapter extends
RecyclerView.Adapter<ItemAdapter.SimpleViewHolder> {
private final Context mContext;

private final int mLayoutId;
ArrayList<NewsStructure> newsArrayLst = new ArrayList<NewsStructure>();

static Typeface typeFace;
String imageUrl = "";

public static class SimpleViewHolder extends RecyclerView.ViewHolder {
public final ImageView imageView;

public SimpleViewHolder(View view) {
super(view);
imageView = (ImageView) view.findViewById(R.id.newsTileImage);

}
}

public ItemAdapter(Context context, TwoWayView recyclerView, int layoutId,
ArrayList<NewsStructure> newsAry) {

mContext = context;
newsArrayLst = newsAry;
mLayoutId = layoutId;

}

@Override
public SimpleViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
final View view = LayoutInflater.from(mContext).inflate(
R.layout.news_feed_item_en, parent, false);
return new SimpleViewHolder(view);
}

@SuppressWarnings("deprecation")
@Override
public void onBindViewHolder(SimpleViewHolder holder, int position) {
final View itemView = holder.itemView;
final int itemId = position;
if (mLayoutId == R.layout.activity_main) {
int dimenId;
final int span;
if (itemId % 3 == 0) {
imageUrl = newsArrayLst.get(position).getmId();
span = 2;
Picasso.with(mContext).load(imageUrl)
.placeholder(R.drawable.ic_launcher).noFade()
.tag("mylist").into(holder.imageView);
} else {
imageUrl =  newsArrayLst.get(position).getmId();;
span = 1;
Picasso.with(mContext).load(imageUrl)
.placeholder(R.drawable.ic_launcher).noFade()
.tag("mylist").into(holder.imageView);
}
dimenId = R.dimen.staggered_child_medium;
final int size = mContext.getResources().getDimensionPixelSize(
dimenId);
final StaggeredGridLayoutManager.LayoutParams lp = (StaggeredGridLayoutManager.LayoutParams) itemView
.getLayoutParams();
lp.span = span;
lp.width = size;
itemView.setLayoutParams(lp);
}
}

@Override
public int getItemCount() {
return newsArrayLst.size();
}
}


NewsStructure.class


NewsStructure.class

package inf.vj.twowaystaggeredgridviewviewcenterposition;

public class NewsStructure {
public String mId ="";

public String getmId() {
return mId;
}

public void setmId(String mId) {
this.mId = mId;
}
}



XML

activity_main.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
     <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="left"
    android:orientation="vertical" >

    <org.lucasr.twowayview.widget.TwoWayView
        android:id="@+id/list"
        style="@style/TwoWayView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="#000000"
        android:visibility="visible"
        app:twowayview_layoutManager="StaggeredGridLayoutManager"
        app:twowayview_numColumns="2"
        app:twowayview_numRows="2" />
   
 
</RelativeLayout>

</LinearLayout>

news_feed_item_en.xml

<?xml version="1.0" encoding="utf-8"?>
<!--
   Copyright (C) 2012 Lucas Rocha

   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
-->
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
    android:layout_height="match_parent">
<ImageView
    android:id="@+id/newsTileImage"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/ic_launcher"
    android:gravity="center"
    android:scaleType="centerCrop"
   />

</RelativeLayout>

Check out this may be help you

Related Posts Plugin for WordPress, Blogger...