The MVC idea in Android I understand is to use Holder to program, display layout, provide views, and bind views and data. In many apps, we can see advertising bars. Here we can use FramLayout to fill in the advertising bars, and then use the MVC idea to add the provided layout to FrameLayout; the implementation of advertising bars can also use open source frameworks such as Banner, etc., which will not be listed here. Interested friends can search for them.
Of course, since the pictures of my project are provided by the designer and are not obtained from the Internet, I directly wrote the ViewPager to fill it out.
<!--Carousel-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="328px">
<.
android:layout_width="match_parent"
android:layout_height="match_parent"
android:/>
<!-- Pointer container -->
<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:
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@android:color/white"
android:text="Description of pictures"/>-->
<LinearLayout
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
</LinearLayout>
</RelativeLayout>
logic:
package ;
import .;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
/**
* Created by zmybi on 29/12/2016.
*/
public class WorkFragment extends BaseFragment {
@Bind(.fragment_work_pic_viewpager)
ViewPager mFragmentWorkPicViewpager;
@Bind(.ll_dots)
LinearLayout mLLDots;
// @Bind(.tv_desc)
// TextView mTvDesc;
@Bind(.ll_kaoqing)
LinearLayout mLlKaoqing;
@Bind(.ll_execute)
LinearLayout mLlExecute;
@Bind(.ll_daohang)
LinearLayout mLlDaohang;
@Bind(.ll_sudden)
LinearLayout mLlSudden;
@Bind(.ll_policething)
LinearLayout mLlPolicething;
@Bind(.ll_collect)
LinearLayout mLlCollect;
@Bind(.ll_search)
LinearLayout mLlSearch;
@Bind(.ll_noticevoice)
LinearLayout mLlNoticevoice;
@Bind(.iv_book)
ImageView mIvBook;
@Bind(.rl_shouce)
RelativeLayout mRlShouce;
@Bind(.ibtn_yuan)
ImageView mIbtnYuan;
@Bind(.ibtn_helpbook)
ImageView mIbtnHelpbook;
private int[] imageResIds = {.banner1,.banner2};
private String[] descs = {"Wuhan Security Group","Intelligent Patrol System"};
private AutoScrollTask mAutoScrollTask;
@Override
public void initData() {
(new OnPagerChangeListenerImp() {
@Override
public void onPageSelected(int position) {
changeDotAndDesc(position);
}
});
(new WorkFragmentBannerAdapter(imageResIds));
initDot();
changeDotAndDesc(0); //The first page is selected by default (().getCount() / 2);
if(mAutoScrollTask == null) {
mAutoScrollTask = new AutoScrollTask();
();
}
//Press to stop the carousel (new () {
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
switch (()) {
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
();
break;
case MotionEvent.ACTION_UP:
();
break;
}
return false;
}
});
}
private void changeDotAndDesc(int position) {
position = position % ;
// (descs[position]);
for(int i = 0; i < ();i++) {
ImageView iv_dot = (ImageView) (i);
iv_dot.setSelected(false);
if(position == i) {
iv_dot.setSelected(true);
}
}
}
private void initDot() {
for(int i = 0; i < ;i++) {
int _5dp = dp2px(5);
params = new (_5dp,_5dp);
= _5dp;
ImageView dot = new ImageView(mActivity);
(params);
(.selector_dot);
(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 = (mActivity,.fragment_work,null);
(this, rootView);
return rootView;
}
@Override
public void onDestroyView() {
();
(this);
}
@OnClick({.rl_shouce,.ibtn_yuan, .ibtn_helpbook,.ll_kaoqing, .ll_execute, .ll_daohang, .ll_sudden, .ll_policething, .ll_collect, .ll_search, .ll_noticevoice})
public void onClick(View view) {
switch (()) {
case .ll_kaoqing:
(mActivity,"Attendance");
break;
case .ll_execute:
(mActivity,"service");
break;
case .ll_daohang:
(mActivity,"Online Store");
break;
case .ll_sudden:
(mActivity,"Breakout");
break;
case .ll_policething:
(mActivity,"Police incident");
break;
case .ll_collect:
(mActivity,"Certification");
break;
case .ll_search:
(mActivity,"Information Query");
break;
case .ll_noticevoice:
(mActivity,"Issuing an Announcement");
break;
case .rl_shouce:
(mActivity,"manual");
break;
case .ibtn_yuan:
(mActivity,"Planning Process");
break;
case .ibtn_helpbook:
(mActivity,"Help Manual");
break;
}
}
private class AutoScrollTask implements Runnable{
public void start() {
stop();
().postDelayed(this,2000);
}
public void stop() {
().removeCallbacks(this);
}
@Override
public void run() {
int currentItem = ();
currentItem++;
(currentItem);
start();
}
}
}
The indicators (small dots) or picture descriptions below the carousel picture can be added, and the specific requirements can be based on the company's artist's requirements.
Issue an optimization to stop the carousel; Click to monitor the viewpager design, rewrite three methods, lift start(), go to the run method viewpager to jump to the next page, and go to the start(), method in AutoScrollTask, and send delay messages to the main thread Handler, and continue to loop the run method, realizing the wireless loop of the carousel diagram
By the way, let’s talk about how to write PagerAdapter for the carousel picture
package ;
import .;
import ;
import ;
import ;
/**
* Created by zmybi on 31/12/2016.
*/
public class WorkFragmentBannerAdapter extends PagerAdapter {
private int[] imageResIds;
public WorkFragmentBannerAdapter(int[] imageResIds) {
= imageResIds;
}
@Override
public int getCount() {
return * 1000000;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView iv = new ImageView(());
position = position % ;
(imageResIds[position]);
(.FIT_XY);
(iv);
return iv;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
((ImageView)object);
}
}
Returning a large number here, there is actually no need to return Integer.MAX_VALUE; Because if you write this way, you need to judge the remainder so that the Indicator below and the picture above are switched consistently. Of course, since the picture given by the artist directly, I put it directly under the project. In fact, if it is obtained from the Internet, you can use Picasso or Glide image loading framework.
At this point, a simple picture carousel function has been implemented.