gridview 實現橫向分頁滑動效果的兩種實現方案
阿新 • • 發佈:2019-01-07
方案一:
樓主在網上找的,能夠實現橫向滑動,但並沒有分頁的效果,樓主覺得簡單實用就一併貼出來了,下面看程式碼:
DisplayMetrics dm; private void setValue() { int count = gridAdapter.getCount(); int numColumns = (count % 2 == 0) ? count / 2 : count / 2 + 1; LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(numColumns * dm.widthPixels / 5, LinearLayout.LayoutParams.WRAP_CONTENT); gridView.setLayoutParams(params); gridView.setColumnWidth(dm.widthPixels / 5); // gridView.setHorizontalSpacing(hSpacing); gridView.setStretchMode(GridView.NO_STRETCH); gridView.setNumColumns(numColumns); } private void getScreenDen() { dm = new DisplayMetrics(); getActivity().getWindowManager().getDefaultDisplay().getMetrics(dm); } /** * 初始化gridview */ @SuppressLint("WrongViewCast") private void initGridView(final JSONArray array) { gridAdapter = new HomeMainGridAdapter(getActivity(), array, null); gridView = (GridView) findViewById(R.id.gview); horizontalScrollView = (HorizontalScrollView) findViewById(R.id.scrollView); horizontalScrollView.setHorizontalScrollBarEnabled(false);// 隱藏滾動條 getScreenDen(); setValue(); gridView.setSelector(new ColorDrawable(Color.TRANSPARENT)); gridView.setAdapter(gridAdapter); }
package com.ly.sxh.activity; import android.content.Context; import android.util.AttributeSet; import android.widget.GridView; /** * Created by cruze on 2015/8/6. */ public class MyGridView extends GridView { public MyGridView(Context context, AttributeSet attrs) { super(context, attrs); } public MyGridView(Context context) { super(context); } public MyGridView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } @Override public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST); super.onMeasure(widthMeasureSpec, expandSpec); } }
<HorizontalScrollView android:id="@+id/scrollView" android:layout_marginTop="2dp" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:id="@+id/linearLayout1" android:layout_width="match_parent" android:layout_height="match_parent"> <com.ly.sxh.activity.MyGridView android:id="@+id/gview" android:layout_gravity="center" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginLeft="2dp" android:layout_marginRight="2dp" android:background="@color/white" android:columnWidth="55dp" android:gravity="center" android:numColumns="5" android:stretchMode="columnWidth" /> </LinearLayout> </HorizontalScrollView>
方案二:
樓主根據專案需求自己寫了一個,實現分頁橫向滑動、主要就是將gridview的資料拆分開來,然後丟到viewpager裡面,其實也可以用fragment,效果是一樣的
ImageView[] dots;
int length;
int pageSize;
private void initViewPager(final JSONArray parkRows) {
RelativeLayout layoutRoute = (RelativeLayout) findViewById(R.id.rl);
android.view.ViewGroup.LayoutParams lp = layoutRoute.getLayoutParams();
lp.height = (int)initHeght();
pager = (ViewPager) findViewById(R.id.vpager);
length = parkRows.length();
pageSize = length % 10 == 0 ? length / 10 : length / 10 + 1;
LinearLayout.LayoutParams margin = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT, 1);
margin.setMargins(11, 0, 11, 0);
ViewGroup group = (ViewGroup) findViewById(R.id.viewGroup);
group.removeAllViews();
//TODO。資料分頁s
try {
dots = new ImageView[pageSize];
View views[] = new View[pageSize];
Context con = getActivity().getApplicationContext();
JSONArray ja = new JSONArray();
List<JSONArray> list = new ArrayList<JSONArray>();
for (int j = 0; j < length; j++) {
ja.put(parkRows.get(j));
if ((j) % 10 == 9) {
list.add(ja);
ja = new JSONArray();
}
}
if (ja.length() > 0) {
list.add(ja);
}
for (int i = 0; i < pageSize; i++) {
ImageView imageView = new ImageView(getActivity());
imageView.setLayoutParams(new LinearLayout.LayoutParams(10, 10));
dots[i] = imageView;
if (i == 0) {
dots[i].setImageResource(R.drawable.ic_focus);
} else {
dots[i].setImageResource(R.drawable.ic_normal);
}
group.addView(imageView, margin);
views[i] = LayoutInflater.from(con).inflate(R.layout.gridpager, null);
initGridView(views[i], list.get(i));
}
HomeGridPageAdapter adapter = new HomeGridPageAdapter(getActivity(), views);
pager.setAdapter(adapter);
} catch (JSONException e) {
e.printStackTrace();
}
initListener();
}
//TODO
private double initHeght() {
//獲取螢幕寬度
DisplayMetrics dm = new DisplayMetrics();
double densityDpi = dm.density;
//獲取螢幕資訊
getActivity().getWindowManager().getDefaultDisplay().getMetrics(dm);
//螢幕寬度
int screenWidth = dm.widthPixels;
return screenWidth/2.2;
}
/**
* 新增事件監聽
*/
private void initListener() {
pager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
boolean isScrolled = false;
@Override
public void onPageScrollStateChanged(int status) {
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
if (pager != null)
pager.invalidate();
}
@Override
public void onPageSelected(int index) {
setImageBackground(index % length);
}
});
}
private void setImageBackground(int index) {
for (int i = 0; i < pageSize; i++) {
if (i == index) {
dots[i].setImageResource(R.drawable.ic_focus);
} else {
dots[i].setImageResource(R.drawable.ic_normal);
}
}
}
private void initGridView(View view, final JSONArray parkRows) {
GridView gridView = (GridView) view.findViewById(R.id.gview);
HomeMainGridAdapter adapter = new HomeMainGridAdapter(getActivity(), parkRows, null);
gridView.setAdapter(adapter);
}
<RelativeLayout
android:id="@+id/rl"
android:layout_marginTop="10dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="160dp">
<android.support.v4.view.ViewPager
android:id="@+id/vpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:background="@color/white"
android:columnWidth="55dp"
android:gravity="center"
android:numColumns="5"
android:stretchMode="columnWidth" />
<LinearLayout
android:id="@+id/viewGroup"
android:layout_width="wrap_content"
android:layout_height="10dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal|bottom"
android:orientation="horizontal">
</LinearLayout>
</RelativeLayout>
package com.ly.sxh.adapter;
import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
/**
* Created by cruze on 2015/9/7.
*/
public class HomeGridPageAdapter extends PagerAdapter {
private Context context;
private View views[];
public HomeGridPageAdapter(Context context, View views[]) {
this.context = context;
this.views = views;
}
@Override
public int getCount() {
return views.length;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
/**
* 載入圖片進去,用當前的position 除以 圖片陣列長度取餘數是關鍵
*/
@Override
public Object instantiateItem(ViewGroup container, int position) {
try {
View view = views[position];
container.addView(view);
} catch (Exception e) {
Log.e("e_pager", e.toString());
}
return views[position];
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(views[position]);
}
}
看下效果圖:
好了,兩個方案都貼出來,樓主直接從專案中擷取的,可能有點亂,單稍微花點時間看下應該能搞定。