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,也就是自定义组合控件的类
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>
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
<?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
相关文章推荐
- android自定义组合控件图片轮播+小圆点+点击跳转广告页面
- android图片轮播+点击跳转广告页面
- 一个简单的图片轮播功能(图片自动播放,点击控件可直接跳转对对应图片)
- 自定义----Banner 轮播加小圆点>> 获取网络图片 点击事件
- 安卓基础--自定义无限轮播的轮播图,可动态添加指示点,可点击跳转页面
- Android自定义组合控件--图片加文字,类似视频播放软件的列表
- Android实现自定义轮播图片控件示例
- Android listView中点击item或Item中控件跳转对应的详情页面的实现(商品详情查看)
- [置顶] Android 自定义轮播图片控件使用
- Android广告图片轮播控件
- 5.轮播广告AndroidImageSlider的使用(包括自定义indicator,和sliderview的点击监听事件,架构分析)
- android 自定义组合控件总结(两个Button点击切换)
- Android自定义图片自动轮播控件:imagecycleview
- Android常用控件之按钮选择器/九妹图,按钮点击事件+页面跳转+Toast,单选框.时间日期控件 /时间日期对话框
- 自定义Android图片轮播控件
- Android自定义图片轮播Banner控件使用解析
- Android自定义样式(风格)的dialog对话框(点击其中的按钮跳转到下一个页面)
- Android-----------广告图片轮播控件
- Android自定义图片轮播控件
- Android广告图片轮播控件,支持无限循环和5种主题,可以灵活设置轮播样式、时间、位置、图片加载框架等!