利用MVC編寫廣告條輪播效果
我理解的安卓中MVC思想是利用Holder進(jìn)行編程,展示布局,提供視圖,將視圖和數(shù)據(jù)進(jìn)行綁定起來(lái),在很多App中我們能見到廣告條,廣告條這里我們可以使用FramLayout進(jìn)行填充,然后利用MVC的思想將提供的布局添加到FrameLayout中即可; 廣告條的實(shí)現(xiàn)也可以利用Banner等開源框架等,這里就不列舉了,感興趣的朋友可以去搜下
當(dāng)然由于我這里的項(xiàng)目的圖片是設(shè)計(jì)師那邊提供好的,并不是從網(wǎng)上獲取的,所以我這里就直接寫了ViewPager來(lái)進(jìn)行填充了
<!--輪播圖-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="328px">
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/fragment_work_pic_viewpager"/>
<!-- 指針容器 -->
<RelativeLayout
android:background="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_alignBottom="@id/fragment_work_pic_viewpager">
<!--<TextView
android:textSize="12sp"
android:layout_gravity="left"
android:layout_marginLeft="5dp"
android:id="@+id/tv_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@android:color/white"
android:text="圖片的描述"/>-->
<LinearLayout
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:id="@+id/ll_dots"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
</LinearLayout>
</RelativeLayout>
邏輯:
package com.hanzheng.znxl.fragment;
import android.support.v4.view.ViewPager;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import com.hanzheng.znxl.R;
import com.hanzheng.znxl.adapter.OnPagerChangeListenerImp;
import com.hanzheng.znxl.adapter.WorkFragmentBannerAdapter;
import com.hanzheng.znxl.base.BaseFragment;
import com.hanzheng.znxl.base.MyApplication;
import com.hanzheng.znxl.utils.ToastUtil;
import butterknife.Bind;
import butterknife.ButterKnife;
import butterknife.OnClick;
/**
* Created by zmybi on 29/12/2016.
*/
public class WorkFragment extends BaseFragment {
@Bind(R.id.fragment_work_pic_viewpager)
ViewPager mFragmentWorkPicViewpager;
@Bind(R.id.ll_dots)
LinearLayout mLLDots;
// @Bind(R.id.tv_desc)
// TextView mTvDesc;
@Bind(R.id.ll_kaoqing)
LinearLayout mLlKaoqing;
@Bind(R.id.ll_execute)
LinearLayout mLlExecute;
@Bind(R.id.ll_daohang)
LinearLayout mLlDaohang;
@Bind(R.id.ll_sudden)
LinearLayout mLlSudden;
@Bind(R.id.ll_policething)
LinearLayout mLlPolicething;
@Bind(R.id.ll_collect)
LinearLayout mLlCollect;
@Bind(R.id.ll_search)
LinearLayout mLlSearch;
@Bind(R.id.ll_noticevoice)
LinearLayout mLlNoticevoice;
@Bind(R.id.iv_book)
ImageView mIvBook;
@Bind(R.id.rl_shouce)
RelativeLayout mRlShouce;
@Bind(R.id.ibtn_yuan)
ImageView mIbtnYuan;
@Bind(R.id.ibtn_helpbook)
ImageView mIbtnHelpbook;
private int[] imageResIds = {R.drawable.banner1,R.drawable.banner2};
private String[] descs = {"武漢保安集團(tuán)","智能巡邏系統(tǒng)"};
private AutoScrollTask mAutoScrollTask;
@Override
public void initData() {
mFragmentWorkPicViewpager.addOnPageChangeListener(new OnPagerChangeListenerImp() {
@Override
public void onPageSelected(int position) {
changeDotAndDesc(position);
}
});
mFragmentWorkPicViewpager.setAdapter(new WorkFragmentBannerAdapter(imageResIds));
initDot();
changeDotAndDesc(0); //默認(rèn)選擇第一頁(yè)
mFragmentWorkPicViewpager.setCurrentItem(mFragmentWorkPicViewpager.getAdapter().getCount() / 2);
if(mAutoScrollTask == null) {
mAutoScrollTask = new AutoScrollTask();
mAutoScrollTask.start();
}
//按下去停止輪播
mFragmentWorkPicViewpager.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
switch (motionEvent.getAction()) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
mAutoScrollTask.stop();
break;
case MotionEvent.ACTION_UP:
mAutoScrollTask.start();
break;
}
return false;
}
});
}
private void changeDotAndDesc(int position) {
position = position % imageResIds.length;
// mTvDesc.setText(descs[position]);
for(int i = 0; i < mLLDots.getChildCount();i++) {
ImageView iv_dot = (ImageView) mLLDots.getChildAt(i);
iv_dot.setSelected(false);
if(position == i) {
iv_dot.setSelected(true);
}
}
}
private void initDot() {
for(int i = 0; i < imageResIds.length;i++) {
int _5dp = dp2px(5);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(_5dp,_5dp);
params.leftMargin = _5dp;
ImageView dot = new ImageView(mActivity);
dot.setLayoutParams(params);
dot.setBackgroundResource(R.drawable.selector_dot);
mLLDots.addView(dot);
}
}
public int dp2px(int dp) {
float density = getResources().getDisplayMetrics().density;
return (int) (dp * density + .5f);
}
@Override
public View initView() {
// TODO: inflate a fragment view
View rootView = View.inflate(mActivity,R.layout.fragment_work,null);
ButterKnife.bind(this, rootView);
return rootView;
}
@Override
public void onDestroyView() {
super.onDestroyView();
ButterKnife.unbind(this);
}
@OnClick({R.id.rl_shouce,R.id.ibtn_yuan, R.id.ibtn_helpbook,R.id.ll_kaoqing, R.id.ll_execute, R.id.ll_daohang, R.id.ll_sudden, R.id.ll_policething, R.id.ll_collect, R.id.ll_search, R.id.ll_noticevoice})
public void onClick(View view) {
switch (view.getId()) {
case R.id.ll_kaoqing:
ToastUtil.showToast(mActivity,"考勤");
break;
case R.id.ll_execute:
ToastUtil.showToast(mActivity,"勤務(wù)");
break;
case R.id.ll_daohang:
ToastUtil.showToast(mActivity,"網(wǎng)店");
break;
case R.id.ll_sudden:
ToastUtil.showToast(mActivity,"突發(fā)");
break;
case R.id.ll_policething:
ToastUtil.showToast(mActivity,"警情");
break;
case R.id.ll_collect:
ToastUtil.showToast(mActivity,"認(rèn)證");
break;
case R.id.ll_search:
ToastUtil.showToast(mActivity,"信息查詢");
break;
case R.id.ll_noticevoice:
ToastUtil.showToast(mActivity,"發(fā)布公告");
break;
case R.id.rl_shouce:
ToastUtil.showToast(mActivity,"手冊(cè)");
break;
case R.id.ibtn_yuan:
ToastUtil.showToast(mActivity,"預(yù)案流程");
break;
case R.id.ibtn_helpbook:
ToastUtil.showToast(mActivity,"幫助手冊(cè)");
break;
}
}
private class AutoScrollTask implements Runnable{
public void start() {
stop();
MyApplication.getMainThreadHandler().postDelayed(this,2000);
}
public void stop() {
MyApplication.getMainThreadHandler().removeCallbacks(this);
}
@Override
public void run() {
int currentItem = mFragmentWorkPicViewpager.getCurrentItem();
currentItem++;
mFragmentWorkPicViewpager.setCurrentItem(currentItem);
start();
}
}
}
這里輪播圖下方的指示器(小點(diǎn))或者圖片描述都是可以加上的, 具體依據(jù)公司美工的要求即可
做了個(gè)按下去停止輪播的優(yōu)化; 給viewpager設(shè)計(jì)點(diǎn)擊監(jiān)聽,重寫三個(gè)方法, 抬起則start(), 走run方法viewpager跳到下一頁(yè),并走AutoScrollTask中的start(),方法,主線程的Handler發(fā)送延時(shí)消息,則繼續(xù)循環(huán)run方法, 實(shí)現(xiàn)輪播圖的無(wú)線循環(huán)
對(duì)了,說下輪播圖的PagerAdapter的寫法
package com.hanzheng.znxl.adapter;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
/**
* Created by zmybi on 31/12/2016.
*/
public class WorkFragmentBannerAdapter extends PagerAdapter {
private int[] imageResIds;
public WorkFragmentBannerAdapter(int[] imageResIds) {
this.imageResIds = imageResIds;
}
@Override
public int getCount() {
return imageResIds.length * 1000000;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView iv = new ImageView(container.getContext());
position = position % imageResIds.length;
iv.setBackgroundResource(imageResIds[position]);
iv.setScaleType(ImageView.ScaleType.FIT_XY);
container.addView(iv);
return iv;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((ImageView)object);
}
}
這里返回一個(gè)很大的數(shù),其實(shí)也沒必要返回Integer.MAX_VALUE; 因?yàn)檫@樣寫的話還要對(duì)余數(shù)進(jìn)行判斷,讓下方的Indicator和上方的圖片切換保持一致, 當(dāng)然,這里由于美工直接給的圖,所以我直接放在工程下了,實(shí)際如果是從網(wǎng)上獲取的,則使用Picasso或者Glide圖片加載框架即可
至此,一個(gè)簡(jiǎn)單的圖片輪播功能就已經(jīng)實(shí)現(xiàn)了。
相關(guān)文章
Android ViewGroup事件分發(fā)和處理源碼分析
這篇文章主要為大家介紹了Android ViewGroup事件分發(fā)和處理源碼分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-02-02
Android開發(fā)App啟動(dòng)流程與消息機(jī)制詳解
這篇文章主要為大家介紹了Android開發(fā)App啟動(dòng)流程與消息機(jī)制詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08
Android使用ImageView 制作透明圓弧實(shí)例代碼
這篇文章主要介紹了Android使用ImageView 制作透明圓弧實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2016-05-05
Android 相機(jī)相冊(cè)權(quán)限設(shè)置方法
今天小編就為大家分享一篇Android 相機(jī)相冊(cè)權(quán)限設(shè)置,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-08-08
Android獲取手機(jī)聯(lián)系人電話號(hào)碼并返回結(jié)果
這篇文章主要為大家詳細(xì)介紹了Android獲取手機(jī)聯(lián)系人電話號(hào)碼并返回結(jié)果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-11-11
Android使用Matrix旋轉(zhuǎn)圖片模擬碟片加載過程
這篇文章主要為大家詳細(xì)介紹了Android使用Matrix旋轉(zhuǎn)圖片模擬碟片加載過程,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03
Android實(shí)現(xiàn)漂亮的Gallery畫廊
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)漂亮的Gallery畫廊,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-05-05
Android自定義ViewGroup實(shí)現(xiàn)標(biāo)簽浮動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了Android自定義ViewGroup實(shí)現(xiàn)標(biāo)簽浮動(dòng)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-06-06
Android實(shí)現(xiàn)微信朋友圈評(píng)論EditText效果
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)微信朋友圈評(píng)論EditText效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-11-11
Android多功能時(shí)鐘開發(fā)案例(實(shí)戰(zhàn)篇)
這篇文章主要為大家詳細(xì)介紹了Android多功能時(shí)鐘開發(fā)案例,開發(fā)了時(shí)鐘、鬧鐘、計(jì)時(shí)器和秒表,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-05-05

