カルーセルは非常に一般的な UI です。バナー フレームワークは、開発を迅速に行い、ホームページのカルーセル イメージ効果のニーズを満たすのに役立ちます。
1.バナーの依存関係をインポートする
implementation 'io.github.youth5201314:banner:2.2.2'
2. Activity_main.xml レイアウト。
banner_loop_time: カルーセルの間隔を設定します。デフォルトは 3000 です; banner_radius: カルーセルの角を丸く設定します
<com.youth.banner.Banner
android:id="@+id/main_banner"
android:layout_width="match_parent"
android:layout_height="210dp"
app:banner_radius="15dp"
android:layout_marginTop="15dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
app:banner_loop_time="2000"
/>
3.バナーアダプターをセットします。
シンプルなカルーセル効果を実現するために、Banner フレームワークは、直接使用できるBannerImageAdapterというアダプターを既に作成しています。
Banner.setAdapter(new BannerImageAdapter(data))
banner.setAdapter(new BannerImageAdapter<Integer>(banner_data) {
@Override
public void onBindView(BannerImageHolder holder, Integer data, int position, int size) {
holder.imageView.setImageResource(data);
}
});
data は回転するデータ (画像) で、drawable フォルダーの下に配置されます。初期データのコード
private void initData(){
banner_data = new ArrayList<>();
banner_data.add(R.drawable.banner001);
banner_data.add(R.drawable.banner002);
banner_data.add(R.drawable.banner003);
banner_data.add(R.drawable.banner004);
banner_data.add(R.drawable.banner005);
banner_data.add(R.drawable.test006);
}
4. 共通プロパティ設定
自動ループ再生を設定します; true == 自動再生
Banner.isAutoLoop(true);
インジケータを設定
Banner.setIndicator(new CircleIndicator(this))
選択時のインジケーターの色(つまり、選択時の小さな点の色)を設定します
Banner.setIndicatorSelectedColor(Color.GREEN)
インジケータ間の距離を設定します
Banner.setIndicatorSpace(int)
完全なコード
package com.example.bannertest;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Color;
import android.os.Bundle;
import com.youth.banner.Banner;
import com.youth.banner.adapter.BannerImageAdapter;
import com.youth.banner.holder.BannerImageHolder;
import com.youth.banner.indicator.CircleIndicator;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private Banner banner;
private List<Integer> banner_data;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
banner = findViewById(R.id.main_banner);
banner.setAdapter(new BannerImageAdapter<Integer>(banner_data) {
@Override
public void onBindView(BannerImageHolder holder, Integer data, int position, int size) {
holder.imageView.setImageResource(data);
}
});
// 开启循环轮播
banner.isAutoLoop(true);
banner.setIndicator(new CircleIndicator(this));
banner.setScrollBarFadeDuration(1000);
// 设置指示器颜色(TODO 即选中时那个小点的颜色)
banner.setIndicatorSelectedColor(Color.GREEN);
// 开始轮播
banner.start();
}
private void initData(){
banner_data = new ArrayList<>();
banner_data.add(R.drawable.banner001);
banner_data.add(R.drawable.banner002);
banner_data.add(R.drawable.banner003);
banner_data.add(R.drawable.banner004);
banner_data.add(R.drawable.banner005);
banner_data.add(R.drawable.test006);
}
}