需要圖片集和源碼請(qǐng)點(diǎn)贊關(guān)注收藏后評(píng)論區(qū)留言即可~~~

電商App的首頁上方，都在明顯位置放了一欄廣告條，并且廣告條會(huì)輪播，非常吸引眼球，這種廣告輪播的功能，為推廣熱門事物出力甚大。

輪播視頻已上傳至我的主頁，有需要可自行前往觀看~

一、需求描述

作為App首頁的常客，廣告輪播特效早就為人所熟知，它的界面也司空見慣 效果如下

廣告條除了廣告圖片之外，底部還有一排圓點(diǎn)，這些圓點(diǎn)被稱作指示器，每當(dāng)輪播到第幾個(gè)廣告，指示器就高亮顯示第幾個(gè)圓點(diǎn)，其余圓點(diǎn)顯示白色，如此依賴用戶便知道當(dāng)前播放到了第幾個(gè)廣告

?

?

?二、界面設(shè)計(jì)

用到的控件如下

1：相對(duì)視圖

2：單選組

3：翻頁視圖

4：翻頁適配器

此外 廣告每隔兩三秒就輪播下一個(gè)廣告，這種自動(dòng)輪播可采用Handler+Runnable，因此有必要將廣告條封裝為單獨(dú)的控件，以便隨時(shí)隨地在各頁面中添加。

三、關(guān)鍵部分?

1：定義廣告條的XML布局文件

采用相對(duì)布局以及內(nèi)部嵌套容納廣告圖片的翻頁視圖

2：編寫廣告條的Java定義代碼

3：為廣告條添加圖片清單

指定廣告圖片的來源以及數(shù)量

4：實(shí)現(xiàn)廣告條的自動(dòng)輪播功能

給廣告條添加圖片清單之后，還得設(shè)置具體的輪播規(guī)則

5：在活動(dòng)頁面中使用廣告條控件

引用時(shí)聲明路徑

四、代碼

Java類

package com.example.chapter10;

import android.annotation.SuppressLint;
import android.os.Bundle;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TextView;

import androidx.appcompat.app.AppCompatActivity;

import com.example.chapter10.util.Utils;
import com.example.chapter10.widget.BannerPager;
import com.example.chapter10.widget.BannerPager.BannerClickListener;

import java.util.ArrayList;
import java.util.List;

@SuppressLint("DefaultLocale")
public class BannerPagerActivity extends AppCompatActivity implements BannerClickListener {
    private static final String TAG = "BannerPagerActivity";
    private TextView tv_pager;

    private List<Integer> getImageList() {
        ArrayList<Integer> imageList = new ArrayList<Integer>();
        imageList.add(R.drawable.banner_1);
        imageList.add(R.drawable.banner_2);
        imageList.add(R.drawable.banner_3);
        imageList.add(R.drawable.banner_4);
        imageList.add(R.drawable.banner_5);
        return imageList; // 返回默認(rèn)的廣告圖片列表
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_banner_pager);
        tv_pager = findViewById(R.id.tv_pager);
        // 從布局文件中獲取名叫banner_pager的廣告輪播條
        BannerPager banner = findViewById(R.id.banner_pager);
        // 獲取廣告輪播條的布局參數(shù)
        LayoutParams params = (LayoutParams) banner.getLayoutParams();
        params.height = (int) (Utils.getScreenWidth(this) * 250f / 640f);
        banner.setLayoutParams(params); // 設(shè)置廣告輪播條的布局參數(shù)
        banner.setImage(getImageList()); // 設(shè)置廣告輪播條的廣告圖片列表
        banner.setOnBannerListener(this); // 設(shè)置廣告輪播條的廣告點(diǎn)擊監(jiān)聽器
        banner.start(); // 開始廣告圖片的輪播滾動(dòng)
    }

    // 一旦點(diǎn)擊了廣告圖，就回調(diào)監(jiān)聽器的onBannerClick方法
    public void onBannerClick(int position) {
        String desc = String.format("您點(diǎn)擊了第%d張圖片", position + 1);
        tv_pager.setText(desc);
    }

}

滾動(dòng)視圖類

package com.example.chapter10;

import android.os.Bundle;
import android.widget.ListView;

import androidx.appcompat.app.AppCompatActivity;

import com.example.chapter10.adapter.PlanetListAdapter;
import com.example.chapter10.bean.Planet;
import com.example.chapter10.widget.NoScrollListView;

public class NoscrollListActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_noscroll_list);
        PlanetListAdapter adapter1 = new PlanetListAdapter(this, Planet.getDefaultList());
        // 從布局文件中獲取名叫l(wèi)v_planet的列表視圖
        // lv_planet是系統(tǒng)自帶的ListView，被ScrollView嵌套只能顯示一行
        ListView lv_planet = findViewById(R.id.lv_planet);
        lv_planet.setAdapter(adapter1); // 設(shè)置列表視圖的行星適配器
        lv_planet.setOnItemClickListener(adapter1);
        lv_planet.setOnItemLongClickListener(adapter1);
        PlanetListAdapter adapter2 = new PlanetListAdapter(this, Planet.getDefaultList());
        // 從布局文件中獲取名叫nslv_planet的不滾動(dòng)列表視圖
        // nslv_planet是自定義控件NoScrollListView，會(huì)顯示所有行
        NoScrollListView nslv_planet = findViewById(R.id.nslv_planet);
        nslv_planet.setAdapter(adapter2); // 設(shè)置不滾動(dòng)列表視圖的行星適配器
        nslv_planet.setOnItemClickListener(adapter2);
        nslv_planet.setOnItemLongClickListener(adapter2);
    }
}

XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <!-- 自定義的廣告輪播條，需要使用全路徑 -->
    <com.example.chapter10.widget.BannerPager
        android:id="@+id/banner_pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/tv_pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:paddingTop="10dp"
        android:text="上面的廣告圖片會(huì)自動(dòng)輪播"
        android:textColor="@color/black"
        android:textSize="17sp" />

</LinearLayout>

2

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/vp_banner"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <RadioGroup
        android:id="@+id/rg_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingBottom="2dp"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" />

</RelativeLayout>

創(chuàng)作不易 覺得有幫助請(qǐng)點(diǎn)贊關(guān)注收藏~~~文章來源地址http://www.zghlxwxcb.cn/news/detail-454737.html

到了這里，關(guān)于Android Studio App開發(fā)實(shí)戰(zhàn)項(xiàng)目之廣告輪播（附源碼 可用于大作業(yè)）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！