Android 使用 SliderLayout 实现App顶部的轮播广告

效果预览

step 1:
添加依赖

compile "com.android.support:support-v4:+"
compile 'com.squareup.picasso:picasso:2.3.2'
compile 'com.nineoldandroids:library:2.4.0'
compile 'com.daimajia.slider:library:1.1.5@aar'

添加位置：

step 2:

建立 layout 文件
fragment_home.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical">

    <com.daimajia.slider.library.SliderLayout
        android:id="@+id/slider"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        />

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        custom:selected_color="#555555"
        custom:unselected_color="#55555555"
        custom:shape="oval"
        custom:selected_padding_left="3dp"
        custom:selected_padding_right="3dp"
        custom:unselected_padding_left="3dp"
        custom:unselected_padding_right="3dp"
        custom:selected_width="8dp"
        custom:selected_height="8dp"
        custom:unselected_width="4dp"
        custom:unselected_height="4dp"
        android:layout_gravity="center"
        />

</LinearLayout>

step 3:
建立 HomeFragment.java文件

package com.diabin.minda.fragment;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Toast;

import com.daimajia.slider.library.Animations.DescriptionAnimation;
import com.daimajia.slider.library.Indicators.PagerIndicator;
import com.daimajia.slider.library.SliderLayout;
import com.daimajia.slider.library.SliderTypes.BaseSliderView;
import com.daimajia.slider.library.SliderTypes.TextSliderView;
import com.daimajia.slider.library.Tricks.ViewPagerEx;
import com.diabin.minda.R;

import static android.support.constraint.Constraints.TAG;

public class HomeFragment extends Fragment {

    private SliderLayout mSliderLayout;

    private PagerIndicator indicator;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {


        View view = inflater.inflate(R.layout.fragment_home,container,false);
        mSliderLayout = (SliderLayout) view.findViewById(R.id.slider);

        //使用自定义的indicator（图片下的小控件）
        indicator = view.findViewById(R.id.custom_indicator);
        initSlider();
        return view;
    }

    private void initSlider(){

        TextSliderView textSliderView = new TextSliderView(this.getActivity());
        textSliderView.description("全职高手");
        textSliderView.image("http://5b0988e595225.cdn.sohucs.com/images/20170724/00e77b81dc7f4b499b3333c63b9bfa92.jpeg");

        //设置点击图片的监听事件
        textSliderView.setOnSliderClickListener(new BaseSliderView.OnSliderClickListener() {
            @Override
            public void onSliderClick(BaseSliderView slider) {
                Toast.makeText(HomeFragment.this.getActivity(),"全职高手",Toast.LENGTH_LONG).show();
            }
        });

        TextSliderView textSliderView2 = new TextSliderView(this.getActivity());
        textSliderView2.description("FateStay Night");
        textSliderView2.image("http://p0.qhimg.com/t01e1560a95362e2c09.jpg");

        //设置点击图片的监听事件
        textSliderView2.setOnSliderClickListener(new BaseSliderView.OnSliderClickListener() {
            @Override
            public void onSliderClick(BaseSliderView slider) {
                Toast.makeText(HomeFragment.this.getActivity(),"FateStay Night",Toast.LENGTH_LONG).show();
            }
        });

        TextSliderView textSliderView3 = new TextSliderView(this.getActivity());
        textSliderView3.description("魔道祖师");
        textSliderView3.image("http://p0.qhimgs4.com/t01d2cf3103a2499646.jpg");

        //设置点击图片的监听事件
        textSliderView3.setOnSliderClickListener(new BaseSliderView.OnSliderClickListener() {
            @Override
            public void onSliderClick(BaseSliderView slider) {
                Toast.makeText(HomeFragment.this.getActivity(),"魔道祖师",Toast.LENGTH_LONG).show();
            }
        });

        mSliderLayout.addSlider(textSliderView);
        mSliderLayout.addSlider(textSliderView2);
        mSliderLayout.addSlider(textSliderView3);


        //使用自定义的indicator
        mSliderLayout.setCustomIndicator(indicator);
        mSliderLayout.setCustomAnimation(new DescriptionAnimation());
        //设置转场效果
        mSliderLayout.setPresetTransformer(SliderLayout.Transformer.DepthPage);
        //时间
        mSliderLayout.setDuration(2000);

        mSliderLayout.addOnPageChangeListener(new ViewPagerEx.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                Log.d(TAG,"onPageScrolled");
            }

            @Override
            public void onPageSelected(int position) {

                Log.d(TAG,"onPageSelected");

            }

            @Override
            public void onPageScrollStateChanged(int state) {

                Log.d(TAG,"onPageScrollStateChanged");

            }
        });
    }
}

step 4:
在 MainActivity.java文件中初始化 HomeFragment.java

package com.diabin.minda;

import android.support.v4.app.FragmentTabHost;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost;
import android.widget.TextView;

import com.diabin.minda.fragment.HomeFragment;

//FragmentTabHost使用第一步，继承FragmentActivity
// AppCompatActivity已经默认继承FragmentActivity，不用再继承FragmentActivity
public class MainActivity extends AppCompatActivity {

    //读取View时用到LayoutInflater
    private LayoutInflater mInflater;

    private FragmentTabHost mTabhost;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mInflater = LayoutInflater.from(this);

        //找到mTabhost
        mTabhost = this.findViewById(android.R.id.tabhost);

        //第二步，重写setup方法
        //第三个参数是用来装载FragmentTabHost的容器的id
        mTabhost.setup(this,getSupportFragmentManager(),R.id.realtabcontent);

        //第三步，添加TabSpec
        TabHost.TabSpec tabSpec = mTabhost.newTabSpec("home");


        View view = mInflater.inflate(R.layout.tab_indicator,null);
        ImageView img = (ImageView)view.findViewById(R.id.icon_tab);
        TextView text = (TextView)view.findViewById(R.id.txt_indicator);

        //添加自己的背景图片
        img.setBackgroundResource(R.drawable.selector_icon_home);
        //添加背景图片下方的文字
        text.setText("主页");

        //第四步，往Indicator添加View
        tabSpec.setIndicator(view);

        //最后一步，将tabSpec添加到mTabhost
        mTabhost.addTab(tabSpec,HomeFragment.class,null);

    }
}

step 5:
建立activity_main.xml文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="true"
    android:fitsSystemWindows="true"
    android:orientation="vertical"
    tools:context=".MainActivity"
    >

    //真正用来装载FragmentTabHost
    <FrameLayout
        android:id="@+id/realtabcontent"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@color/bg_color"
        />

    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        >

        //官方要求的写法（id也要照写），只写入，不使用
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0"
            />
    </android.support.v4.app.FragmentTabHost>
</LinearLayout>

项目结构：

结束