Day13 Android - banner(横幅广告)应用(2)

接下来要讲有关线上取图的banner,会分开主要是因为有些微的不一样,包含在Manifest中添加网路的权限,另外添加图片的方式也略有不同,那麽就开始今天的主题,首先一样,先添加依赖至gradle/dependcies中。

依赖

    implementation 'com.youth.banner:banner:1.4.9'
    implementation "com.github.bumptech.glide:glide:3.7.0"

与之前一样,添加banner及glide图片载入器,接着就先加入Internet权限至manifests/AndroidManifest中。

权限

因为是使用网路的图片,所以需要加上这一行网路的权限。
https://ithelp.ithome.com.tw/upload/images/20210928/201392595o0AENxh6h.jpg


布局

<--布局LinearLayout,将广告放置於底部-->
<com.youth.banner.Banner
            android:id="@+id/banner"
            android:layout_width="match_parent"
            android:layout_height="170dp"
            android:layout_alignParentStart="true"
            android:layout_alignParentBottom="true"
            android:layout_marginStart="0dp"
            android:layout_marginBottom="0dp" />

布局的部分就延续前一张所设计的来用,当然布局也是用LinearLayout并放置最底部,接着就到java上的设计与加入图片。

banner

public class MainActivity extends AppCompatActivity {
    Banner banner;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        banner = findViewById(R.id.banner);
        String[] resourceID = new String[]{"https://img1.dowebok.com/414.jpg"
        ,"https://img.scbao.com/uploads/allimg/140112/235112-14011221122072.jpg"
        ,"https://image-wallpaper.com/img/a/fe5/wZwpmL0ADMtMXau5WZ09VZsJWY09yNy8SOwYTMwIzL09SaopXai9yZtl2Lt92Yuk3azZXaucWbp9yL6MHc0RHa.jpg"};
        //线上图片索引则用String[]
        List<String> img_list = new ArrayList<>();
        for (int i = 0; i < resourceID.length; i++) {
            img_list.add(resourceID[i]);              //加入图片
            banner.setImageLoader(new ImageLoader() {
                @Override
                public void displayImage(Context context, Object path, ImageView imageView) {
                    Glide.with(MainActivity.this).load(path).into(imageView);//Glide加载图片
                }
            });
            banner.setBannerAnimation(Transformer.Accordion);//轮播动画效果
            banner.setImages(img_list);//设定图片位址(已加入至List中)
            banner.setDelayTime(5000);//播5秒自动切换
            //banner.isAutoPlay(true);自动切换,设定好setDelayTime也会自动切换
            banner.start();
        }
    }
}

与昨天不同的点只有在宣告阵列的时候,因为是网址所以形态要改成String,而List也是要改成String,这样他就会去对应的网站抓图下来,这样就能简单做使用了,重点只在於Internet的权限一定得加。


成果

我抓的图是篮球、羽球及桌球的素材图,那麽接着就看到成果图:

https://ithelp.ithome.com.tw/upload/images/20210825/20139259ZHQrGjq2eX.jpg

https://ithelp.ithome.com.tw/upload/images/20210825/20139259yFP2vPXktk.jpg

https://ithelp.ithome.com.tw/upload/images/20210825/20139259XrPXSKcKVS.jpg


<<:  [Day13] 团队系统设计-估点技巧

>>:  Day 13 : 优化 Zettelkasten 卡片盒笔记法,试试Evergreen Note (长青笔记)

11.unity地图障碍物(Tilemap Collider 2D)

结合前几天学到的东西,可以来制作地图障碍物并且在地图内奔跑! 地图障碍物 1.画一张纯障碍物的Til...

【I Love Vue 】 Day 29 爱荷华博弈任务(十) - Demo

话不多说,赶紧把我们的作品Demo 给我们 铁人学院的业主吧!! Demo 进入主画面 我们可以透过...

自动化 End-End 测试 Nightwatch.js 与 BrowserStack

BrowserStack 一个提供各式浏览器、移动装备的平台,前面虽然有稍微提到这个东西,不过都没什...

D8 - 你不知道Combo : 甜点用一杯 Mojito 解释 直译器、编译器

前言 吃了前菜、主餐,没有饭後甜点怎麽可以呢! 你不知道 Combo 套餐系列最後一道,以一杯 Mo...

TailwindCSS 从零开始 - 翻转卡片实战:TailwindCSS feat CSS

实作内容 此次会透过 TailwindCSS 与 SCSS 共同使用来完成此页面,并透过 CSS ...