Android 사용자 정의 Horizontal ScrollView 강력 한 갤러리 효과 만 들 기
20206 단어 AndroidHorizontalScrollViewGallery
1.Horizontal ScrollView 의 간단 한 용법
Horizontal ScrollView 는 사실 FrameLayout 의 하위 클래스 이기 때문에 내부 에 직접적인 하위 View 만 있 을 수 있 습 니 다.우 리 는 Gallery 효 과 를 만 드 는 데 사 용 됩 니 다.우선 LinearLayout 을 선택 한 다음 방향 을 수평 으로 설정 합 니 다.
1)레이아웃 파일:
<LinearLayout 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"
>
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="150dp"
android:layout_gravity="center_vertical"
android:background="#AA444444"
android:scrollbars="none" >
<LinearLayout
android:id="@+id/id_gallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="horizontal" >
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
MainActivity:
package com.example.zhy_horizontalscrollview;
import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
public class MainActivity extends Activity
{
private LinearLayout mGallery;
private int[] mImgIds;
private LayoutInflater mInflater;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
mInflater = LayoutInflater.from(this);
initData();
initView();
}
private void initData()
{
mImgIds = new int[] { R.drawable.a, R.drawable.b, R.drawable.c,
R.drawable.d, R.drawable.e, R.drawable.f, R.drawable.g,
R.drawable.h, R.drawable.l };
}
private void initView()
{
mGallery = (LinearLayout) findViewById(R.id.id_gallery);
for (int i = 0; i < mImgIds.length; i++)
{
View view = mInflater.inflate(R.layout.activity_index_gallery_item,
mGallery, false);
ImageView img = (ImageView) view
.findViewById(R.id.id_index_gallery_item_image);
img.setImageResource(mImgIds[i]);
TextView txt = (TextView) view
.findViewById(R.id.id_index_gallery_item_text);
txt.setText("some info ");
mGallery.addView(view);
}
}
}
효과 그림:
효 과 는 괜 찮 은 것 같 아 요.사진 몇 장만 간단하게 보 여 드 리 면 돼 요.
다음은 본론 으로 들 어 가 려 고 합 니 다.Horizontal ScrollView 는 안에 있 는 뷰 가 아무리 많아 도 회수 되 지 않 습 니 다.일 정량 이 되면 OOM 이 발생 합 니 다.Horizontal ScollView 를 어떻게 고 쳐 서 글 의 시작 효 과 를 실현 하 는 지 소개 합 니 다.
2.사용자 정의 Horizontal ScrollView
생각:
1.먼저 화면의 크기 와 Item 의 크기 에 따라 한 화면 에 최대 몇 개의 Item 을 불 러 올 수 있 는 지 계산 한 다음 에 이 수량의 Item 을 불 러 옵 니 다.
2.사용자 가 오른쪽 에서 왼쪽으로 미 끄 러 지고 일정한 거리 로 미 끄 러 지면 다음 장 을 불 러 오고 첫 번 째 장 을 삭제 합 니 다.
3.사용자 가 왼쪽 에서 오른쪽으로 미 끄 러 지고 일정한 거리 로 미 끄 러 질 때 한 장 을 불 러 오고 마지막 장 을 삭제 합 니 다.
마지막 효과 도 보기:
일정한 재 미 를 더 하기 위해 위 와 같은 앨범 효 과 를 만 들 었 습 니 다.드래그 할 때 자동 으로 변 하 는 것 을 지원 합 니 다.클릭 변화 와~짱 이 죠~
1)먼저 레이아웃 파일 보기:
<LinearLayout 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:background="@android:color/white"
android:orientation="vertical" >
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<ImageView
android:id="@+id/id_content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:layout_margin="10dp"
android:scaleType="centerCrop"
android:src="@drawable/ic_launcher" />
</FrameLayout>
<com.example.zhy_horizontalscrollview.MyHorizontalScrollView
android:id="@+id/id_horizontalScrollView"
android:layout_width="wrap_content"
android:layout_height="150dp"
android:layout_gravity="bottom"
android:background="@android:color/white"
android:scrollbars="none" >
<LinearLayout
android:id="@+id/id_gallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="horizontal" >
</LinearLayout>
</com.example.zhy_horizontalscrollview.MyHorizontalScrollView>
</LinearLayout>
2),국제 와 연결 하기 위해 서,우리 도 어댑터 를 만 듭 니 다.BaseAdapter 와 유사 합 니 다.
package com.example.zhy_horizontalscrollview;
import java.util.List;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class HorizontalScrollViewAdapter
{
private Context mContext;
private LayoutInflater mInflater;
private List<Integer> mDatas;
public HorizontalScrollViewAdapter(Context context, List<Integer> mDatas)
{
this.mContext = context;
mInflater = LayoutInflater.from(context);
this.mDatas = mDatas;
}
public int getCount()
{
return mDatas.size();
}
public Object getItem(int position)
{
return mDatas.get(position);
}
public long getItemId(int position)
{
return position;
}
public View getView(int position, View convertView, ViewGroup parent)
{
ViewHolder viewHolder = null;
if (convertView == null)
{
viewHolder = new ViewHolder();
convertView = mInflater.inflate(
R.layout.activity_index_gallery_item, parent, false);
viewHolder.mImg = (ImageView) convertView
.findViewById(R.id.id_index_gallery_item_image);
viewHolder.mText = (TextView) convertView
.findViewById(R.id.id_index_gallery_item_text);
convertView.setTag(viewHolder);
} else
{
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.mImg.setImageResource(mDatas.get(position));
viewHolder.mText.setText("some info ");
return convertView;
}
private class ViewHolder
{
ImageView mImg;
TextView mText;
}
}
package com.example.zhy_horizontalscrollview;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.ImageView;
import com.example.zhy_horizontalscrollview.MyHorizontalScrollView.CurrentImageChangeListener;
import com.example.zhy_horizontalscrollview.MyHorizontalScrollView.OnItemClickListener;
public class MainActivity extends Activity
{
private MyHorizontalScrollView mHorizontalScrollView;
private HorizontalScrollViewAdapter mAdapter;
private ImageView mImg;
private List<Integer> mDatas = new ArrayList<Integer>(Arrays.asList(
R.drawable.a, R.drawable.b, R.drawable.c, R.drawable.d,
R.drawable.e, R.drawable.f, R.drawable.g, R.drawable.h,
R.drawable.l));
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
mImg = (ImageView) findViewById(R.id.id_content);
mHorizontalScrollView = (MyHorizontalScrollView) findViewById(R.id.id_horizontalScrollView);
mAdapter = new HorizontalScrollViewAdapter(this, mDatas);
//
mHorizontalScrollView
.setCurrentImageChangeListener(new CurrentImageChangeListener()
{
@Override
public void onCurrentImgChanged(int position,
View viewIndicator)
{
mImg.setImageResource(mDatas.get(position));
viewIndicator.setBackgroundColor(Color
.parseColor("#AA024DA4"));
}
});
//
mHorizontalScrollView.setOnItemClickListener(new OnItemClickListener()
{
@Override
public void onClick(View view, int position)
{
mImg.setImageResource(mDatas.get(position));
view.setBackgroundColor(Color.parseColor("#AA024DA4"));
}
});
//
mHorizontalScrollView.initDatas(mAdapter);
}
}
한 무더기 의 그림 전시,유사 상품 전환,더욱 간단 하 다 면 스크롤 감청 과 클릭 감청 을 설정 할 필요 가 없습니다~
4),마지막 으로 사용자 정의 MyHorizontal ScrollView 클래스 보기
package com.example.zhy_horizontalscrollview;
import java.util.HashMap;
import java.util.Map;
import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.WindowManager;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
public class MyHorizontalScrollView extends HorizontalScrollView implements
OnClickListener
{
/**
*
*
* @author zhy
*
*/
public interface CurrentImageChangeListener
{
void onCurrentImgChanged(int position, View viewIndicator);
}
/**
*
*
* @author zhy
*
*/
public interface OnItemClickListener
{
void onClick(View view, int pos);
}
private CurrentImageChangeListener mListener;
private OnItemClickListener mOnClickListener;
private static final String TAG = "MyHorizontalScrollView";
/**
* HorizontalListView LinearLayout
*/
private LinearLayout mContainer;
/**
*
*/
private int mChildWidth;
/**
*
*/
private int mChildHeight;
/**
* index
*/
private int mCurrentIndex;
/**
*
*/
private int mFristIndex;
/**
* View
*/
private View mFirstView;
/**
*
*/
private HorizontalScrollViewAdapter mAdapter;
/**
*
*/
private int mCountOneScreen;
/**
*
*/
private int mScreenWitdh;
/**
* View
*/
private Map<View, Integer> mViewPos = new HashMap<View, Integer>();
public MyHorizontalScrollView(Context context, AttributeSet attrs)
{
super(context, attrs);
//
WindowManager wm = (WindowManager) context
.getSystemService(Context.WINDOW_SERVICE);
DisplayMetrics outMetrics = new DisplayMetrics();
wm.getDefaultDisplay().getMetrics(outMetrics);
mScreenWitdh = outMetrics.widthPixels;
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
mContainer = (LinearLayout) getChildAt(0);
}
/**
*
*/
protected void loadNextImg()
{
//
if (mCurrentIndex == mAdapter.getCount() - 1)
{
return;
}
// ， 0
scrollTo(0, 0);
mViewPos.remove(mContainer.getChildAt(0));
mContainer.removeViewAt(0);
// ， onclick ，
View view = mAdapter.getView(++mCurrentIndex, null, mContainer);
view.setOnClickListener(this);
mContainer.addView(view);
mViewPos.put(view, mCurrentIndex);
//
mFristIndex++;
//
if (mListener != null)
{
notifyCurrentImgChanged();
}
}
/**
*
*/
protected void loadPreImg()
{
// ，
if (mFristIndex == 0)
return;
//
int index = mCurrentIndex - mCountOneScreen;
if (index >= 0)
{
// mContainer = (LinearLayout) getChildAt(0);
//
int oldViewPos = mContainer.getChildCount() - 1;
mViewPos.remove(mContainer.getChildAt(oldViewPos));
mContainer.removeViewAt(oldViewPos);
// View
View view = mAdapter.getView(index, null, mContainer);
mViewPos.put(view, index);
mContainer.addView(view, 0);
view.setOnClickListener(this);
// view
scrollTo(mChildWidth, 0);
// --， --
mCurrentIndex--;
mFristIndex--;
//
if (mListener != null)
{
notifyCurrentImgChanged();
}
}
}
/**
*
*/
public void notifyCurrentImgChanged()
{
// ，
for (int i = 0; i < mContainer.getChildCount(); i++)
{
mContainer.getChildAt(i).setBackgroundColor(Color.WHITE);
}
mListener.onCurrentImgChanged(mFristIndex, mContainer.getChildAt(0));
}
/**
* ，
*
* @param mAdapter
*/
public void initDatas(HorizontalScrollViewAdapter mAdapter)
{
this.mAdapter = mAdapter;
mContainer = (LinearLayout) getChildAt(0);
// View
final View view = mAdapter.getView(0, null, mContainer);
mContainer.addView(view);
// View
if (mChildWidth == 0 && mChildHeight == 0)
{
int w = View.MeasureSpec.makeMeasureSpec(0,
View.MeasureSpec.UNSPECIFIED);
int h = View.MeasureSpec.makeMeasureSpec(0,
View.MeasureSpec.UNSPECIFIED);
view.measure(w, h);
mChildHeight = view.getMeasuredHeight();
mChildWidth = view.getMeasuredWidth();
Log.e(TAG, view.getMeasuredWidth() + "," + view.getMeasuredHeight());
mChildHeight = view.getMeasuredHeight();
// View
mCountOneScreen = mScreenWitdh / mChildWidth+2;
Log.e(TAG, "mCountOneScreen = " + mCountOneScreen
+ " ,mChildWidth = " + mChildWidth);
}
//
initFirstScreenChildren(mCountOneScreen);
}
/**
* View
*
* @param mCountOneScreen
*/
public void initFirstScreenChildren(int mCountOneScreen)
{
mContainer = (LinearLayout) getChildAt(0);
mContainer.removeAllViews();
mViewPos.clear();
for (int i = 0; i < mCountOneScreen; i++)
{
View view = mAdapter.getView(i, null, mContainer);
view.setOnClickListener(this);
mContainer.addView(view);
mViewPos.put(view, i);
mCurrentIndex = i;
}
if (mListener != null)
{
notifyCurrentImgChanged();
}
}
@Override
public boolean onTouchEvent(MotionEvent ev)
{
switch (ev.getAction())
{
case MotionEvent.ACTION_MOVE:
// Log.e(TAG, getScrollX() + "");
int scrollX = getScrollX();
// scrollX view ， ，
if (scrollX >= mChildWidth)
{
loadNextImg();
}
// scrollX = 0， ，
if (scrollX == 0)
{
loadPreImg();
}
break;
}
return super.onTouchEvent(ev);
}
@Override
public void onClick(View v)
{
if (mOnClickListener != null)
{
for (int i = 0; i < mContainer.getChildCount(); i++)
{
mContainer.getChildAt(i).setBackgroundColor(Color.WHITE);
}
mOnClickListener.onClick(v, mViewPos.get(v));
}
}
public void setOnItemClickListener(OnItemClickListener mOnClickListener)
{
this.mOnClickListener = mOnClickListener;
}
public void setCurrentImageChangeListener(
CurrentImageChangeListener mListener)
{
this.mListener = mListener;
}
}
코드 에 view 와 posion 을 전문 적 으로 저장 하 는 Map 이 있 습 니 다.주로 리 셋 을 누 르 면 현재 View 의 위 치 를 제공 하기 위해 서 입 니 다.약간 유사 합 니 다.Android 사용자 정의 ViewPager 는 변화무쌍 한 이미지 전환 효과 에 있 는 Map 의 교묘 한 용법 을 만 듭 니 다~
ViewPager 와 Horizontal ScrollView 의 합 체 를 완전히 구현 하 였 습 니까~~~Horizontal ScrollView 의 효과,ViewPager 의 특성~~~~
마지막 으로 화면 회전 후의 효과 도 를 붙 입 니 다.
앨범 을 만 드 는 것 뿐만 아니 라 사진 윤 방 을 하 는 것 도 방금 생각 한 것 임 을 알 수 있다!
원본 다운로드:Horizontal ScrollView 강력 한 갤러리 효과 만 들 기
만약 당신 의 프로젝트 에 Gallery 와 비슷 한 효과 가 필요 하 다 면,전례 를 과감하게 사용 해 보 세 요!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Bitrise에서 배포 어플리케이션 설정 테스트하기이 글은 Bitrise 광고 달력의 23일째 글입니다. 자체 또는 당사 등에서 Bitrise 구축 서비스를 사용합니다. 그나저나 며칠 전 Bitrise User Group Meetup #3에서 아래 슬라이드를 발표했...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
