您的位置:首页 > 移动开发 > Android开发

android自定义组合控件图片轮播+小圆点+点击跳转广告页面

2018-01-03 14:19 423 查看
1.写一个布局,用于自定义组合控件

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="200dp">
<!--图片轮播-->
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="200dp"></android.support.v4.view.ViewPager>
<!--展示小圆点-->
<LinearLayout
android:id="@+id/llt"
android:background="#999999"
android:gravity="center"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="40dp"></LinearLayout>
</RelativeLayout>2.写一个类继承RelativeLayout,也就是自定义组合控件的类
public class AutoBanner extends RelativeLayout {
DianJi dianji;
private ViewPager viewPager;
private LinearLayout llt;
private Myhandler h;

public AutoBanner(Context context) {
this(context,null);
}

public AutoBanner(Context context, AttributeSet attrs) {
this(context, attrs,0);
}

public AutoBanner(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//将布局绘制到控件
LayoutInflater inflater = LayoutInflater.from(context);
View view = inflater.inflate(R.layout.mybanner, this, true);
//通过id获取控件
viewPager = view.findViewById(R.id.viewpager);
llt = view.findViewById(R.id.llt);
}

//写一个获取数据的方法,同时获取适配器
public void setAdaper(Context context,List<com.bwie.zengxianglin1511j20180102.bean.DataBean> data){
Myadaper m=new Myadaper(context,data);
viewPager.setAdapter(m);

//写一个集合用于放指示器,也就是小圆点
final List<ImageView> yuandian=new ArrayList();
//有多少图片放几个圆点
for (int i = 0; i < data.size(); i++) {
ImageView yuan=new ImageView(context);
//给图片添加选中和未选中的状态
yuan.setBackgroundResource(R.drawable.dot_drawable);
//添加到集合
yuandian.add(yuan);
//这是布局参数,,刚开始小圆点之间没有距离,所以使用java代码指定宽度高度,并且指定小圆点之间的距离
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(5,0,5,0);
//放到LinearLayout,也就是圆点布局中
llt.addView(yuan,params);
}
//默认第一个选中
yuandian.get(0).setSelected(true);
//给viewpager添加滑动监听
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}

@Override
public void onPageSelected(int position) {
position=position%yuandian.size();
for (int i = 0; i <yuandian.size(); i++) {
//如果滑动的图片下标等于圆点下标就是圆点选中
if(i==position){
yuandian.get(i).setSelected(true);
}else{
//不等于就不选中
yuandian.get(i).setSelected(false);
}
}
}

@Override
public void onPageScrollStateChanged(int state) {

}
});
//2.手动的可以无限滑动  可以左滑
viewPager.setCurrentItem(yuandian.size()*100000);//设置当前展示中间某个足够大的位置
//设置自动轮播
h = new Myhandler();
autoPlay();
}

private void autoPlay() {
h.sendEmptyMessageDelayed(0,2000);
}

//自动轮播
class  Myhandler extends Handler{
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
//显示下一页的消息
viewPager.setCurrentItem(viewPager.getCurrentItem()+1);
//再次发送
h.sendEmptyMessageDelayed(0,2000);
}
}

//适配器
class Myadaper extends PagerAdapter{
Context con;
List<com.bwie.zengxianglin1511j20180102.bean.DataBean> data;

public Myadaper(Context con,List<com.bwie.zengxianglin1511j20180102.bean.DataBean> data){
this.con=con;
this.data=data;
}
/**
* viewPager具有预加载,默认的前后加载一页,,,默认的容器里面最多三页
* @param container
* @param position
* @return
*/
@Override
public Object instantiateItem(ViewGroup container, final int position) {
//写一个ImageView控件
ImageView iv=new ImageView(con);
//给控件设置图片
Glide.with(con).load(data.get(position%data.size()).getIcon()).into(iv);
//添加到容器当中
container.addView(iv);

//给imageView设置触摸的监听事件,再点击的时候要暂停发送
iv.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
switch (motionEvent.getAction()){
case MotionEvent.ACTION_DOWN://按下的时候应该取消发送消息的操作
h.removeCallbacksAndMessages(null);
break;
case MotionEvent.ACTION_MOVE://移动的动作
h.removeCallbacksAndMessages(null);
break;
case MotionEvent.ACTION_CANCEL://取消
h.sendEmptyMessageDelayed(0,2000);
break;
case MotionEvent.ACTION_UP://抬起的时候
h.sendEmptyMessageDelayed(0,2000);
break;
}
return false;
}
});

//设置ImageView的点击事件,用于接口回调传值
iv.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
//因为是无线轮播,所以要魔除集合长度再能获取正常下标
dianji.dian(position%data.size());
}
});
//2.把当前展示的视图返回
return iv;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
//销毁视图
container.removeView((View) object);
}

@Override
public int getCount() {
return Integer.MAX_VALUE;//设置成最大,无限轮播
}

@Override
public boolean isViewFromObject(View view, Object object) {
return view==object;
}
}

//写一个接口,用于ImageView点击事件
public interface DianJi{
void dian(int position);
}
//写一个方法供外部访问
public void  fang(DianJi dianji){
this.dianji=dianji;
}
}

3.小圆点的xml布局背景   res右键Android  resource file

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="@drawable/dot_select"></item>
<item android:state_selected="false" android:drawable="@drawable/dot_no_select"></item>
</selector>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<size android:width="10dp" android:height="10dp"/>
<solid android:color="#fff"/>
</shape>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<size android:width="10dp" android:height="10dp"/>
<solid android:color="#82B34E"/>
</shape>


4.mainACtivity的布局和应用
  //布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.bwie.zengxianglin1511j20180102.MainActivity">

<com.bwie.zengxianglin1511j20180102.AutoBanner
android:id="@+id/myban"
android:layout_width="wrap_content"
android:layout_height="wrap_content"></com.bwie.zengxianglin1511j20180102.AutoBanner>

</LinearLayout>

//应用
public class MainActivity extends AppCompatActivity implements AutoBanner.DianJi{
private List<bean.DataBean> data;
private AutoBanner myban;
String url="https://www.zhaoapi.cn/ad/getAd";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

//通过id获取控件
myban = findViewById(R.id.myban);
//获取数据
getDate();
//接口回调
myban.fang(this);
}

private void getDate() {
//异步请求数据
new MyAsyncTask().execute(url);
}
//实现接口,用于接收值
@Override
public void dian(int position) {
//type:返回0或1
//0 跳转到Webview详情页
//1 Toast弹出提示“我要跳转到商品详情页”
int type = data.get(position).getType();
if(type==0){
Intent in=new Intent(MainActivity.this,Main2Activity.class);
in.putExtra("url",data.get(position).getUrl());
startActivity(in);
}else if(type==1){
Toast.makeText(MainActivity.this,"我要跳转到商品详情页", Toast.LENGTH_SHORT).show();
}
}

private class MyAsyncTask extends AsyncTask<String,Void,String>{

@Override
protected String doInBackground(String... strings) {
//调取工具类请求数据
return Util.tojson(strings[0]);
}

@Override
protected void onPostExecute(String s) {
super.onPostExecute(s);
//解析JSON
Gson g=new Gson();
bean bean = g.fromJson(s, bean.class);
data = bean.getData();
//调取自定义控件的方法,给自定义ViewPager添加数据
myban.setAdaper(MainActivity.this, data);
}
}
}//点击图片跳转到详情页面的activity
//布局

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.bwie.zengxianglin1511j20180102.Main2Activity"
>
//展示网页
<WebView
android:id="@+id/mWebView"
android:layout_width="match_parent"
android:layout_height="wrap_content"></WebView>

</android.support.constraint.ConstraintLayout>//应用
public class Main2Activity extends AppCompatActivity {
WebView mWebView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
Intent intent = getIntent();
String url = intent.getStringExtra("url");
Toast.makeText(Main2Activity.this,url+"aaaa",Toast.LENGTH_LONG).show();

mWebView = (WebView) findViewById(R.id.mWebView);
mWebView.loadUrl(url);
mWebView.requestFocusFromTouch();
mWebView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
/**覆盖调用系统或自带浏览器行为打开网页*/
mWebView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// TODO Auto-generated method stub
view.loadUrl(url);
return true;
}
});
/**判断加载过程*/
mWebView.setWebChromeClient(new WebChromeClient() {
@Override
public void onProgressChanged(WebView view, int newProgress) {
// TODO Auto-generated method stub
if (newProgress == 100) {
// 网页加载完成

} else {
// 加载中

}
}
});

initListener();
}

private void initListener() {
/**打开页面时, 自适应屏幕*/
WebSettings webSettings = mWebView .getSettings();
webSettings.setUseWideViewPort(true);//设置此属性,可任意比例缩放
webSettings.setLoadWithOverviewMode(true);

/**便页面支持缩放*/
webSettings.setJavaScriptEnabled(true);
webSettings.setBuiltInZoomControls(true);
webSettings.setSupportZoom(true);
}
}

96e3
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐