이 글에서는 Android가 WeChat을 모방하여 Moments에 사진을 보내는 효과에 대한 관련 정보를 주로 소개합니다. 도움이 필요한 친구는
을 참조하여 먼저 효과를 살펴보세요.
구현 방법에 대해 이야기해 보겠습니다.
구현 아이디어
1. 데이터 소스, 데이터 소스는 우리의 각 댓글입니다(이름, 제목, 그림 배열 포함)
2. 사용자 정의 어댑터(ListView 임베디드(GridView 포함)
3. 이미지를 클릭하여 이미지를 찾아보세요(Fragment+ViewPager)
특정 구현
1. 데이터 소스를 초기화하고 어댑터를 설정한 후 코드를 살펴보세요.
public class MyActivity extends Activity { /*图片显示列表*/ private ListView listView; /*图片URL数组*/ private List<ContentBean> contentBeans; /*说说适配器*/ private MyAdapter adapter; /** * Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); initData(); initViews(); } /** * 初始化数据 */ private void initData(){ contentBeans = new ArrayList<ContentBean>(); ArrayList<String> imgUrls1 = new ArrayList<String>(); imgUrls1.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); ContentBean cb1 = new ContentBean(1,"java","Sun Microsystems",imgUrls1); contentBeans.add(cb1); ArrayList<String> imgUrls2 = new ArrayList<String>(); imgUrls2.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls2.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls2.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); ContentBean cb2 = new ContentBean(2,"OC","Stepstone",imgUrls2); contentBeans.add(cb2); ArrayList<String> imgUrls3 = new ArrayList<String>(); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); imgUrls3.add("http://7xojuc.com1.z0.glb.clouddn.com/110H2E40-6.jpg?attname=&e=1448288962&token=KDsCqUAWz3P-YT6In6oPnT56Eh2cig4zgQd12SJ_:AlTjfYD9SBFOdB4jmmZuKXAMOp8"); ContentBean cb3 = new ContentBean(3,"python","Guido van Rossum",imgUrls3); contentBeans.add(cb3); } private void initViews(){ listView = (ListView) findViewById(R.id.lv_my); adapter = new MyAdapter(MyActivity.this,contentBeans); listView.setAdapter(adapter); } }
여기에 있는 사진은 제가 Qiniu에 업로드한 온라인 사진입니다. 아래의 특정 ImageLoader 구성도 있습니다.
2. 어댑터 내용을 살펴보세요
토크 목록 어댑터에 이미지 어댑터를 설정합니다. 이미지의 GridView는 슬라이드할 수 없는 다시 작성된 GridView입니다.
3. 이 웹사이트에는 많은 데모와 자세한 설명이 있습니다. 아래는 setOnPageChangeListener()를 모니터링하여 아래 이미지 인덱스 값을 변경하는 것입니다.
public class MyAdapter extends BaseAdapter { private Context context; private List<ContentBean> data; public MyAdapter(Context context, List<ContentBean> data) { this.context = context; this.data = data; } @Override public int getCount() { return data.size(); } @Override public Object getItem(int i) { return data.get(i); } @Override public long getItemId(int i) { return i; } @Override public View getView(int i, View view, ViewGroup viewGroup) { ViewHolder holder; if (view == null) { holder = new ViewHolder(); view = View.inflate(context, R.layout.item, null); holder.gridView = (NoScrollGridView) view.findViewById(R.id.gridview); holder.tvName = (TextView) view.findViewById(R.id.tv_name); holder.tvTitle = (TextView) view.findViewById(R.id.tv_title); view.setTag(holder); } else { holder = (ViewHolder) view.getTag(); } final ContentBean bean = data.get(i); holder.tvName.setText(bean.getName()); holder.tvTitle.setText(bean.getTitle()); if (data != null && data.size() > 0) { holder.gridView.setAdapter(new ImageGridAdapter(context, bean.getImgUrls())); } /** * 图片列表点击事件 */ holder.gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) { Intent intent = new Intent(context, ImagePagerActivity.class); intent.putExtra(ImagePagerActivity.EXTRA_IMAGE_URLS, (Serializable) bean.getImgUrls()); intent.putExtra(ImagePagerActivity.EXTRA_IMAGE_INDEX, i); context.startActivity(intent); } }); return view; } class ViewHolder { TextView tvName, tvTitle; NoScrollGridView gridView; } }
길게 누르기 클릭 이벤트와 이미지 로딩 상태를 포함하는 이미지 Fragment의 상세 인터페이스
/** * 图片查看器 */ public class ImagePagerActivity extends FragmentActivity { private static final String STATE_POSITION = "STATE_POSITION"; public static final String EXTRA_IMAGE_INDEX = "image_index"; public static final String EXTRA_IMAGE_URLS = "image_urls"; private HackyViewPager mPager; private int pagerPosition; private TextView indicator; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.image_detail_pager); pagerPosition = getIntent().getIntExtra(EXTRA_IMAGE_INDEX, 0); ArrayList<String> urls = getIntent().getStringArrayListExtra(EXTRA_IMAGE_URLS); mPager = (HackyViewPager) findViewById(R.id.pager); ImagePagerAdapter mAdapter = new ImagePagerAdapter(getSupportFragmentManager(), urls); mPager.setAdapter(mAdapter); indicator = (TextView) findViewById(R.id.indicator); CharSequence text = getString(R.string.viewpager_indicator, 1, mPager.getAdapter().getCount()); indicator.setText(text); // 更新下标 mPager.setOnPageChangeListener(new OnPageChangeListener() { @Override public void onPageScrollStateChanged(int arg0) { } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { } @Override public void onPageSelected(int arg0) { CharSequence text = getString(R.string.viewpager_indicator, arg0 + 1, mPager.getAdapter().getCount()); indicator.setText(text); } }); if (savedInstanceState != null) { pagerPosition = savedInstanceState.getInt(STATE_POSITION); } mPager.setCurrentItem(pagerPosition); } @Override public void onSaveInstanceState(Bundle outState) { outState.putInt(STATE_POSITION, mPager.getCurrentItem()); } private class ImagePagerAdapter extends FragmentStatePagerAdapter { public ArrayList<String> fileList; public ImagePagerAdapter(FragmentManager fm, ArrayList<String> fileList) { super(fm); this.fileList = fileList; } @Override public int getCount() { return fileList == null ? 0 : fileList.size(); } @Override public Fragment getItem(int position) { String url = fileList.get(position); return ImageDetailFragment.newInstance(url); } } }
ImageLoader 초기화를 잊어버렸네요. 다들 Application에 적어두겠습니다.
package com.hankkin.WeiXinLookImgsDemo.activty; import android.graphics.Bitmap; import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.ProgressBar; import android.widget.Toast; import com.hankkin.WeiXinLookImgsDemo.R; import com.nostra13.universalimageloader.core.ImageLoader; import com.nostra13.universalimageloader.core.assist.FailReason; import com.nostra13.universalimageloader.core.listener.SimpleImageLoadingListener; import com.others.PhotoViewAttacher; /** * 单张图片显示Fragment */ public class ImageDetailFragment extends Fragment { private String mImageUrl; private ImageView mImageView; private ProgressBar progressBar; private PhotoViewAttacher mAttacher; public static ImageDetailFragment newInstance(String imageUrl) { final ImageDetailFragment f = new ImageDetailFragment(); final Bundle args = new Bundle(); args.putString("url", imageUrl); f.setArguments(args); return f; } @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); mImageUrl = getArguments() != null ? getArguments().getString("url") : null; } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { final View v = inflater.inflate(R.layout.image_detail_fragment, container, false); mImageView = (ImageView) v.findViewById(R.id.image); mAttacher = new PhotoViewAttacher(mImageView); mAttacher.setOnPhotoTapListener(new PhotoViewAttacher.OnPhotoTapListener() { @Override public void onPhotoTap(View arg0, float arg1, float arg2) { getActivity().finish(); } }); mAttacher.setOnLongClickListener(new View.OnLongClickListener() { @Override public boolean onLongClick(View view) { Toast.makeText(getActivity().getApplicationContext(),"保存",Toast.LENGTH_SHORT).show(); return false; } }); progressBar = (ProgressBar) v.findViewById(R.id.loading); return v; } @Override public void onActivityCreated(Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); ImageLoader.getInstance().displayImage(mImageUrl, mImageView, new SimpleImageLoadingListener() { @Override public void onLoadingStarted(String imageUri, View view) { progressBar.setVisibility(View.VISIBLE); } @Override public void onLoadingFailed(String imageUri, View view, FailReason failReason) { String message = null; switch (failReason.getType()) { case IO_ERROR: message = "下载错误"; break; case DECODING_ERROR: message = "图片无法显示"; break; case NETWORK_DENIED: message = "网络有问题,无法下载"; break; case OUT_OF_MEMORY: message = "图片太大无法显示"; break; case UNKNOWN: message = "未知的错误"; break; } Toast.makeText(getActivity(), message, Toast.LENGTH_SHORT).show(); progressBar.setVisibility(View.GONE); } @Override public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) { progressBar.setVisibility(View.GONE); mAttacher.update(); } }); } }
위 내용은 친구에게 사진을 보라고 보낼 때 Android가 WeChat을 모방하는 효과에 대한 내용입니다. 모든 사람이 Android 소프트웨어 프로그래밍을 배우는 데 도움이 되기를 바랍니다.
위 내용은 Moments에 대한 WeChat 게시물을 모방하고 사진을 탐색하기 위한 Android 개발 예제 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!