系出名门Android(7) - 控件(View)之ZoomControls, Include, VideoView, WebView, RatingBar, Tab

简介:
[索引页]
[源码下载]


系出名门Android(7) - 控件(View)之ZoomControls, Include, VideoView, WebView, RatingBar, Tab, Spinner, Chronometer, ScrollView


作者: webabcd


介绍
在 Android 中使用各种控件(View)
  • ZoomControls - 放大/缩小按钮控件
  • Include - 整合控件
  • VideoView - 视频播放控件
  • WebView - 浏览器控件
  • RatingBar - 评分控件
  • Tab - 选项卡控件
  • Spinner - 下拉框控件
  • Chronometer - 计时器控件
  • ScrollView - 滚动条控件


1、ZoomControls 的 Demo
zoomcontrols.xml 
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                放大/缩小按钮控件 
        
-->  
         < ZoomControls   android:id ="@+id/zoomControls"  
                 android:layout_width ="wrap_content"   android:layout_height ="wrap_content" > </ ZoomControls >  

</ LinearLayout >
 
_ZoomControls.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.view.View;  
import  android.view.View.OnClickListener;  
import  android.widget.Toast;  
import  android.widget.ZoomControls;  

public   class  _ZoomControls   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.zoomcontrols);  

                setTitle( "ZoomControls");  

                ZoomControls zoomControls = (ZoomControls)   this.findViewById(R.id.zoomControls);  
                 // setOnZoomInClickListener() - 响应单击放大按钮的事件 
                zoomControls.setOnZoomInClickListener( new  OnClickListener() {  
                         public   void  onClick(View v) {  
                                Toast.makeText(_ZoomControls. this,   "单击了放大按钮", Toast.LENGTH_SHORT).show();  
                        }  
                });  
                  
                 // setOnZoomOutClickListener() - 响应单击缩小按钮的事件 
                zoomControls.setOnZoomOutClickListener( new  OnClickListener() {  
                         public   void  onClick(View v) {  
                                Toast.makeText(_ZoomControls. this,   "单击了缩小按钮", Toast.LENGTH_SHORT).show();          
                        }  
                });  

        }  
}
 
 
2、Include 的 Demo
include.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                include - 整合控件,将指定的 layout 整合进来 
                        layout - 指定需要整合 layout 
        
-->  
         < include   android:id ="@+id/cell1"   layout ="@layout/include_1"   />  
         < include   android:id ="@+id/cell2"   android:layout_width ="fill_parent"   layout ="@layout/include_2"   />  

</ LinearLayout >
 
include_1.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< TextView   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:text ="TextView01"   android:layout_width ="wrap_content"  
         android:layout_height ="wrap_content" >  
</ TextView >
 
include_2.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< TextView   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:text ="TextView02"   android:layout_width ="wrap_content"  
         android:layout_height ="wrap_content" >  
</ TextView >
 
_Include.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  

public   class  _Include   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.include);  

                setTitle( "Include");  
        }  
}
 
 
3、VideoView 的 Demo
videoview.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                VideoView - 视频播放控件 
        
-->  
         < VideoView   android:id ="@+id/videoView"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content" >  
         </ VideoView >  
                  
</ LinearLayout >
 
_VideoView.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.net.Uri;  
import  android.os.Bundle;  
import  android.widget.MediaController;  
import  android.widget.VideoView;  

public   class  _VideoView   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.videoview);  

                setTitle( "VideoView");  
                  
                VideoView videoView = (VideoView) findViewById(R.id.videoView);  
                  
                 // 指定需要播放的视频的地址 
                videoView.setVideoURI(Uri.parse( "android.resource://com.webabcd.view/" + R.raw.demo)); 
                // videoView.setVideoPath(); 
                    
                // 设置播放器的控制条 
                videoView.setMediaController(new MediaController(this)); 
                // 开始播放视频 
                videoView.start(); 
        } 
}
 
 
4、WebView 的 Demo
webview.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                WebView - 浏览器控件(WebKit 内核) 
        
-->  
         < WebView   android:layout_width ="fill_parent"  
                 android:layout_height ="wrap_content"   android:id ="@+id/webView"   />  
                  
</ LinearLayout >
 
_WebView.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.webkit.WebSettings;  
import  android.webkit.WebView;  

public   class  _WebView   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.webview);  

                setTitle( "WebView");  
                  
                WebView webView = (WebView) findViewById(R.id.webView);  

                 // 配置浏览器,使其可支持 JavaScript 
                WebSettings webSettings = webView.getSettings();  
                webSettings.setJavaScriptEnabled( true);  
                  
                 // 清除浏览器缓存 
                webView.clearCache( true);  
                 // 指定浏览器需要解析的 url 地址 
                webView.loadUrl( "http://webabcd.cnblogs.com/"); 
                // 指定浏览器需要解析的 html 数据 
                // webView.loadData("<a href='http://webabcd.cnblogs.com/'>webabcd</a>", "text/html", "utf-8"); 
        } 
}
 
 
5、RatingBar 的 Demo
ratingbar.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                RatingBar - 评分控件 
                        numStars - 评分控件的星星的数量 
                        rating - 当前评分的值         
        
-->  
         < RatingBar   android:id ="@+id/ratingBar"   android:numStars ="5"  
                 android:rating ="1.5"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content" >  
         </ RatingBar >  

         < TextView   android:id ="@+id/textView"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content"   />  

</ LinearLayout >
 
_RatingBar.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.widget.RatingBar;  
import  android.widget.TextView;  

public   class  _RatingBar   extends  Activity   implements  RatingBar.OnRatingBarChangeListener {  

         private  RatingBar mRatingBar;  
         private  TextView mTextView;  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.ratingbar);  

                setTitle( "RatingBar");  

                mTextView = (TextView) findViewById(R.id.textView);  
                mRatingBar = (RatingBar) findViewById(R.id.ratingBar);  

                 // setOnRatingBarChangeListener() - 响应评分值发生改变的事件 
                mRatingBar.setOnRatingBarChangeListener( this);  
        }  

        @Override  
         public   void  onRatingChanged(RatingBar ratingBar,   float  rating,  
                         boolean  fromUser) {  
                mTextView.setText(String.valueOf(rating));  
        }  
}
 
 
6、Tab 的 Demo
tab.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< FrameLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:layout_width ="fill_parent"   android:layout_height ="fill_parent" >  

        <!--  Tab 1 的内容 -->  
         < TextView   android:id ="@+id/view1"   android:layout_width ="fill_parent"  
                 android:layout_height ="fill_parent"   android:text ="tab1 content"   />  
                  
        <!--  Tab 2 的内容 -->  
         < TextView   android:id ="@+id/view2"   android:layout_width ="fill_parent"  
                 android:layout_height ="fill_parent"   android:text ="tab2 content"   />  

</ FrameLayout >
 
_Tab.java
package  com.webabcd.view;  

import  android.app.TabActivity;  
import  android.content.Intent;  
import  android.os.Bundle;  
import  android.view.LayoutInflater;  
import  android.widget.TabHost;  

// 实现 Tab 功能的话要继承 TabActivity 
public   class  _Tab   extends  TabActivity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  

                TabHost tabHost = getTabHost();  
                LayoutInflater.from( this).inflate(R.layout.tab, tabHost.getTabContentView(),   true);  

                 // Tab 1 的内容 
                tabHost.addTab(tabHost.newTabSpec( "tab1")  
                                .setIndicator( "tab1")  
                                .setContent(R.id.view1));  
                  
                 // Tab 2 的内容(设置了 Tab 图片) 
                tabHost.addTab(tabHost.newTabSpec( "tab2")  
                                .setIndicator( "tab2", getResources().getDrawable(R.drawable.icon01))  
                                .setContent(R.id.view2));  
                  
                 // Tab 3 的内容(设置 Tab 的内容为指定的 Activity) 
                tabHost.addTab(tabHost.newTabSpec( "tab3")  
                                .setIndicator( "tab3")  
                                .setContent( new  Intent( this, _TextView. class)));  

        }  
}
 
 
7、Spinner 的 Demo
spinner.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

         < TextView   android:layout_width ="fill_parent"  
                 android:layout_height ="wrap_content"   android:id ="@+id/textView"   />  

        <!--  
                Spinner - 下拉框控件 
        
-->                  
         < Spinner   android:id ="@+id/spinner"   android:layout_width ="fill_parent"  
                 android:layout_height ="wrap_content"   />  

</ LinearLayout >
 
_Spinner.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.view.View;  
import  android.widget.AdapterView;  
import  android.widget.ArrayAdapter;  
import  android.widget.Spinner;  
import  android.widget.TextView;  

public   class  _Spinner   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.spinner);  

                setTitle( "Spinner");  

                Spinner spinner = (Spinner) findViewById(R.id.spinner);  
                  
                 // 设置下拉框控件的标题文本 
                spinner.setPrompt( "请选择");  
                 // 实例化适配器,指定显示格式及数据源 
                ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(  
                                 this, R.array.colors, android.R.layout.simple_spinner_item);  
                adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);  
                spinner.setAdapter(adapter);  

                 // setOnItemSelectedListener() - 响应下拉框的选中值发生变化的事件 
                spinner.setOnItemSelectedListener( new  AdapterView.OnItemSelectedListener() {  
                        @Override  
                         public   void  onItemSelected(AdapterView<?> arg0, View arg1,  
                                         int  arg2,   long  arg3) {  
                                TextView textView = (TextView)_Spinner. this.findViewById(R.id.textView);  
                                textView.setText(((TextView)arg1).getText());  
                        }  

                        @Override  
                         public   void  onNothingSelected(AdapterView<?> arg0) {  
                                                                  
                        }  
                });  
        }  
}
 
 
8、Chronometer 的 Demo
chronometer.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                Chronometer - 计时器控件 
        
-->  
         < Chronometer   android:id ="@+id/chronometer"  
                 android:layout_width ="wrap_content"   android:layout_height ="wrap_content"   />  

         < Button   android:id ="@+id/btnStart"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content"   android:text ="开始计时" >  
                 < requestFocus   />  
         </ Button >  

         < Button   android:id ="@+id/btnStop"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content"   android:text ="停止计时" >  
         </ Button >  

         < Button   android:id ="@+id/btnReset"   android:layout_width ="wrap_content"  
                 android:layout_height ="wrap_content"   android:text ="计时器复位" >  
         </ Button >  

</ LinearLayout >
 
_Chronometer.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.os.SystemClock;  
import  android.view.View;  
import  android.view.View.OnClickListener;  
import  android.widget.Button;  
import  android.widget.Chronometer;  

public   class  _Chronometer   extends  Activity {  

         private  Chronometer mChronometer;  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.chronometer);  

                setTitle( "Chronometer");  

                Button button;  

                mChronometer = (Chronometer) findViewById(R.id.chronometer);  
                 // 设置计时器所显示的时间格式 
                mChronometer.setFormat( "计时:(%s)");  
                  
                button = (Button) findViewById(R.id.btnStart);  
                button.setOnClickListener(mStartListener);  

                button = (Button) findViewById(R.id.btnStop);  
                button.setOnClickListener(mStopListener);  

                button = (Button) findViewById(R.id.btnReset);  
                button.setOnClickListener(mResetListener);  
        }  

        View.OnClickListener mStartListener =   new  OnClickListener() {  
                 public   void  onClick(View v) {  
                         // 启动计时器 
                        mChronometer.start();  
                }  
        };  

        View.OnClickListener mStopListener =   new  OnClickListener() {  
                 public   void  onClick(View v) {  
                         // 暂停计时器 
                        mChronometer.stop();  
                }  
        };  

        View.OnClickListener mResetListener =   new  OnClickListener() {  
                 public   void  onClick(View v) {  
                         // 复位计时器,即停止计时器 
                        mChronometer.setBase(SystemClock.elapsedRealtime());  
                }  
        };  
}
 
 
9、ScrollView 的 Demo 
scrollview.xml
<? xml   version ="1.0"   encoding ="utf-8" ?>  
< LinearLayout   xmlns:android ="http://schemas.android.com/apk/res/android"  
         android:orientation ="vertical"   android:layout_width ="fill_parent"  
         android:layout_height ="fill_parent" >  

        <!--  
                ScrollView - 滚动条控件 
                        scrollbarStyle - 滚动条的样式 
        
-->  
         < ScrollView   android:id ="@+id/scrollView"  
                 android:layout_width ="fill_parent"   android:layout_height ="200px"  
                 android:scrollbarStyle ="outsideOverlay"   android:background ="@android:drawable/edit_text" >  
                 < TextView   android:layout_width ="fill_parent"  
                         android:layout_height ="wrap_content"   android:id ="@+id/textView"   />  
         </ ScrollView >  

</ LinearLayout >
 
_ScrollView.java
package  com.webabcd.view;  

import  android.app.Activity;  
import  android.os.Bundle;  
import  android.widget.TextView;  

public   class  _ScrollView   extends  Activity {  

        @Override  
         protected   void  onCreate(Bundle savedInstanceState) {  
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState);  
                 this.setContentView(R.layout.scrollview);  

                setTitle( "ScrollView");  

                TextView textView = (TextView) this.findViewById(R.id.textView);  
                textView.setText( "a\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na");  
        }  
}
 
 



     本文转自webabcd 51CTO博客,原文链接: http://blog.51cto.com/webabcd/342082 ,如需转载请自行联系原作者

相关文章
|
4月前
|
缓存 JavaScript 前端开发
Android WebView常见问题
本文主要介绍了在Android开发中WebView的使用方法,包括加载网址、设置相关属性(如JavaScript支持、缓存模式、屏幕适配等)、监听网页加载过程以及返回上一页面的功能实现。同时针对Android P版本限制明文流量的问题(ERR_CLEARTEXT_NOT_PERMITTED),提供了在`AndroidManifest.xml`中添加`android:usesCleartextTraffic=&quot;true&quot;`的解决办法。文章还附有完整代码示例,帮助开发者快速上手并解决常见问题。希望对您的开发工作有所帮助!
210 1
|
4月前
|
搜索推荐 Android开发 开发者
Android星级评分条RatingBar样式的改变及出现问题的解决方法
本文介绍了自定义 RatingBar 的实现方法,通过布局文件、layer-list 样式文件和 style 文件的配置完成个性化星星评分效果。关键步骤包括:1) 在布局文件中添加 RatingBar 并引用样式;2) 创建 layer-list 文件定义背景、次级进度和进度图片;3) 在 style 文件中定义 RatingBar 样式并应用到布局中。可能出现的问题及解决办法:直接报错通常是图片素材过大,调整尺寸即可;星星流眼泪是图片形状问题,需将图片置于透明圆形或正方形内重新组合。附有具体代码示例,方便开发者快速上手实现自定义评分组件。
159 12
|
4月前
|
XML 搜索推荐 Android开发
Android改变进度条控件progressbar的样式(根据源码修改)
本文介绍了如何基于Android源码自定义ProgressBar样式。首先分析了系统源码中ProgressBar样式的定义,发现其依赖一张旋转图片实现动画效果。接着分两步指导开发者实现自定义:1) 模仿源码创建一个旋转动画XML文件(放置在drawable文件夹),修改图片为自定义样式;2) 在UI控件中通过`indeterminateDrawable`属性应用该动画。最终实现简单且个性化的ProgressBar效果,附带效果图展示。
248 2
|
4月前
|
Android开发
Android控件样式的抽取(小提及快捷方式)
在Android开发中,若多个控件样式重复,可抽取公共部分以简化代码。例如对EditText提取样式,通过编辑`styles.xml`实现复用。为提高效率,Android Studio提供自动提取Style功能:右键点击控件样式选项,选择“Style...”,勾选需要提取的属性后确认,即可快速生成样式代码,显著提升开发便利性。
124 2
|
6月前
|
XML JavaScript Android开发
【Android】网络技术知识总结之WebView,HttpURLConnection,OKHttp,XML的pull解析方式
本文总结了Android中几种常用的网络技术,包括WebView、HttpURLConnection、OKHttp和XML的Pull解析方式。每种技术都有其独特的特点和适用场景。理解并熟练运用这些技术,可以帮助开发者构建高效、可靠的网络应用程序。通过示例代码和详细解释,本文为开发者提供了实用的参考和指导。
161 15
|
11月前
|
程序员 开发工具 Android开发
Android|WebView 禁止长按,限制非白名单域名的跳转层级
如何限制 WebView 仅域名白名单网址能随意跳转,并禁用长按选择文字。
167 2
|
12月前
|
XML 编解码 Android开发
安卓开发中的自定义视图控件
【9月更文挑战第14天】在安卓开发中,自定义视图控件是一种高级技巧,它可以让开发者根据项目需求创建出独特的用户界面元素。本文将通过一个简单示例,引导你了解如何在安卓项目中实现自定义视图控件,包括创建自定义控件类、处理绘制逻辑以及响应用户交互。无论你是初学者还是有经验的开发者,这篇文章都会为你提供有价值的见解和技巧。
145 3
|
11月前
|
XML 存储 Java
浅谈Android的TextView控件
浅谈Android的TextView控件
105 0
|
前端开发 Android开发 开发者
安卓开发中的自定义视图:构建你的第一个控件
【8月更文挑战第26天】在安卓开发的浩瀚海洋中,自定义视图是一块充满魔力的乐土。它不仅是开发者展示创造力的舞台,更是实现独特用户体验的关键。本文将带你步入自定义视图的世界,从基础概念到实战应用,一步步教你如何打造自己的第一个控件。无论你是初学者还是有经验的开发者,这篇文章都将为你的开发之旅增添新的风景。
|
XML 数据格式
Android-自定义三角形评分控件
Android-自定义三角形评分控件
133 0

热门文章

最新文章