當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

自定义控件——轮播广告条

發布時間：2025/1/21 编程问答 22 豆豆

生活随笔收集整理的這篇文章主要介紹了自定义控件——轮播广告条小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

1. 效果圖

2. 布局文件

<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><android.support.v4.view.ViewPagerandroid:id="@+id/viewpager"android:layout_width="match_parent"android:layout_height="180dp"/><LinearLayoutandroid:layout_alignBottom="@id/viewpager"android:layout_marginTop="50dp"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#5000"android:gravity="center"android:orientation="vertical"><TextViewandroid:id="@+id/tv_title"android:layout_width="wrap_content"android:layout_height="wrap_content"android:textColor="#fff"android:textSize="16dp"android:text="廣告條標題"/><LinearLayoutandroid:id="@+id/ll_point_group"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"></LinearLayout></LinearLayout></RelativeLayout>

3. 輪播控制邏輯

public class MainActivity extends AppCompatActivity {private ViewPager mViewPager;private TextView mTv_title;private LinearLayout mLl_point_group;private int previousIndex = 0; //上一個圓點的索引private int[] imageIds = {R.mipmap.a, R.mipmap.b, R.mipmap.c, R.mipmap.d, R.mipmap.e}; //初始化圖片數據private int middleIndex = Integer.MAX_VALUE / 2 % imageIds.length;//viewpager中間顯示的索引private String[] descriptions = {"標題一,標題一,標題一", "標題二,標題二,標題二","標題三,標題三,標題三", "標題四,標題四,標題四", "標題五,標題五,標題五"};//廣告的描述信息private Handler mHandler = new Handler(){@Overridepublic void handleMessage(Message msg) {switch (msg.what) {case 0:mViewPager.setCurrentItem(mViewPager.getCurrentItem() + 1);mHandler.sendEmptyMessageDelayed(0, 2000);break;}}};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();initData();}private void initData() {//初始化小圓點for (int i = 0; i < imageIds.length; i++) {//創建一個寬高都為20像素的布局參數，實際開發中這里一般都會將像素轉化為dpLinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(20, 20);ImageView point = new ImageView(MainActivity.this);point.setImageResource(R.drawable.selector_point_bg);if (i != 0) {layoutParams.leftMargin = 20;//相當于layout_marginleftpoint.setEnabled(false);}point.setLayoutParams(layoutParams);mLl_point_group.addView(point);}//給ViewPager設置頁面切換監聽mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}@Overridepublic void onPageSelected(int position) {//動態更新廣告條標題mTv_title.setText(descriptions[position % imageIds.length]);//先將上一個小圓點置為未選中狀態mLl_point_group.getChildAt(previousIndex).setEnabled(false);previousIndex = position % imageIds.length;//將小圓點設置為able狀態mLl_point_group.getChildAt(position % imageIds.length).setEnabled(true);}@Overridepublic void onPageScrollStateChanged(int state) {}});//讓ViewPager永遠先顯示第一張圖片mViewPager.setCurrentItem(Integer.MAX_VALUE / 2 - middleIndex);//setCurrentItem方法調用的時候addOnPageChangeListener會執行//循環播放mHandler.sendEmptyMessageDelayed(0, 2000);//設置ViewPage的觸摸監聽mViewPager.setOnTouchListener(new View.OnTouchListener() {@Overridepublic boolean onTouch(View view, MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN://停止輪播mHandler.removeCallbacksAndMessages(null);break;case MotionEvent.ACTION_UP://繼續輪播mHandler.sendEmptyMessageDelayed(0, 2000);break;}return false;//false沒有消費當前的觸摸事件，會繼續發送給viewpager的源碼中的ontouchevent方法所以它滑動起來}});}private void initView() {mViewPager = (ViewPager) findViewById(R.id.viewpager);mTv_title = (TextView) findViewById(R.id.tv_title);mLl_point_group = (LinearLayout) findViewById(R.id.ll_point_group);//小圓點的容器//給ViewPager設置適配器mViewPager.setAdapter(new MyAdapter(this, imageIds));} }

4. ViewPager適配器

public class MyAdapter extends PagerAdapter {private Context mContext;private int[] mDatas;public MyAdapter(Context context, int[] datas) {mContext = context;mDatas = datas;}@Overridepublic int getCount() {return Integer.MAX_VALUE;//讓ViewPager無限輪播}@Overridepublic boolean isViewFromObject(View view, Object object) {return view == object;}@Overridepublic Object instantiateItem(ViewGroup container, int position) {//初始化視圖ImageView imageView = new ImageView(mContext);int index = position % mDatas.length;//取模，防止數組越界異常imageView.setBackgroundResource(mDatas[index]);//添加到容器container.addView(imageView);//返回視圖return imageView;}@Overridepublic void destroyItem(ViewGroup container, int position, Object object) {container.removeView((View) object);} }

5. 小圓點圖片

小白點

小紅點

6. 小圓點圖片選擇器

**備注：**圖片選擇器和shape繪制的圖片都是放在res/drawable下面。

非常感謝您的耐心閱讀，希望我的文章對您有幫助。歡迎點評、轉發或分享給您的朋友或技術群。

總結

以上是生活随笔為你收集整理的自定义控件——轮播广告条的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。