一步一步学android之控件篇——ScrollView
一个手机的屏幕大小是有限的，那么我要显示的东西显示不下怎么办？这就会使用到ScrollView来进行滚动显示，他的定义如下：
可以看到ScrollView是继承于FrameLayout的，所以ScrollView也可以当做一个布局来看，而在后面的例子也能看出ScrollView确实是有布局管理器一样的效果。因为ScrollView有两种（一种是横的HorizontalScrollView，一种是垂直的ScrollView，为了区分，后面就称其为VerticalScrollView），所以今天的例子有点多，我把这两个结合在一起。
要实现的功能如下：在VerticalScrollView中放入8个按钮当做导航，点击屏幕空白处来控制导航的伸缩，在HorizontalScrollView中放入8个按钮，当做菜单。具体实现效果如下：
主界面
VerticalScrollView效果：
HorzontalScrollView效果：
其中上面VerticalScrollView用到了动画（后面有专门的篇幅来学习，这里只是为了效果，可直接拷贝动画文件）。
在res文件夹下面建立一个anim的子文件夹存放动画文件（inoftranslate和outoftranslate），代码如下：
outoftranslate：
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="-100%"
android:fromYDelta="0"
android:toYDelta="0"
android:duration="1000"/>
<alpha
android:fromAlpha="1"
android:toAlpha="0"
android:duration="1000"></alpha>
</set>
inoftranslate：
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="-100%"
android:toXDelta="0"
android:fromYDelta="0"
android:toYDelta="0"
android:duration="1000"/>
<alpha
android:fromAlpha="0"
android:toAlpha="1"
android:duration="1000"></alpha>
</set>
然后新建两个布局文件（horizontal.xml和vertical.xml），代码如下：
horizontal.xml：
<RelativeLayout 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"
> <ImageView
android:id="@+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="@+id/bottom"
android:background="@drawable/img_2" /> <HorizontalScrollView
android:id="@+id/bottom"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:scrollbars="none" > <LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
android:background="#ffccff" > <Button
android:id="@+id/Button1"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@drawable/png_1" /> <Button
android:id="@+id/Button2"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_2" /> <Button
android:id="@+id/Button3"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_3" /> <Button
android:id="@+id/Button4"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_4" /> <Button
android:id="@+id/Button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_5" /> <Button
android:id="@+id/Button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_6" /> <Button
android:id="@+id/Button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_7" /> <Button
android:id="@+id/Button8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_8" /> </LinearLayout>
</HorizontalScrollView> </RelativeLayout>
vertical.xml：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/mainLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
> <ImageView
android:id="@+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="@+id/bottom"
android:background="@drawable/img_1" /> <ScrollView
android:id="@+id/scrollView1"
android:scrollbars="none"
android:layout_width="wrap_content"
android:layout_height="wrap_content" > <LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="@+id/Button1"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@drawable/png_1" /> <Button
android:id="@+id/Button2"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_2" /> <Button
android:id="@+id/Button3"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_3" /> <Button
android:id="@+id/Button4"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_4" /> <Button
android:id="@+id/Button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_5" /> <Button
android:id="@+id/Button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_6" /> <Button
android:id="@+id/Button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_7" /> <Button
android:id="@+id/Button8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/png_8" />
</LinearLayout>
</ScrollView> <TextView
android:id="@+id/show"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="显示哪个按钮被点击"
android:textSize="30sp" /> </RelativeLayout>
然后是main.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"
android:orientation="vertical"
android:background="@drawable/background"> <Button
android:id="@+id/horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="HorizontalScrollView例子"
android:textColor="#ffccff"
android:textSize="20sp"
android:background="@drawable/button_selector" /> <Button
android:id="@+id/vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="VerticalScrollView例子"
android:textColor="#ffccff"
android:textSize="20sp"
android:layout_marginTop="20dp"
android:background="@drawable/button_selector" /> </LinearLayout>
接下来新建两个java文件（HorizontalScrollView.java和VerticalScrollView.java），代码如下：
HorizontalScrollView.java：
package com.example.scrollviewdemo; import android.app.Activity;
import android.os.Bundle;
import android.view.Window; /**
* @author Kay
* @blog http://blog.csdn.net/Kaypro
*/
public class HorizontalScrollView extends Activity{
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
super.setContentView(R.layout.horizontal);
}
}
VerticalScrollView.java：
package com.example.scrollviewdemo; import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.Window;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.LinearInterpolator;
import android.widget.Button;
import android.widget.RelativeLayout;
import android.widget.ScrollView;
import android.widget.TextView; /**
* @author Kay
* @blog http://blog.csdn.net/Kaypro
*/
public class VerticalScrollView extends Activity {
private ScrollView scroll = null;
private RelativeLayout mainLayout = null;
private Animation outoftranslate;
private Animation inoftranslate;
private TextView show = null; private Button button1 = null;
private Button button2 = null;
private Button button3 = null;
private Button button4 = null;
private Button button5 = null;
private Button button6 = null;
private Button button7 = null;
private Button button8 = null;
/**
* 是否显示导航栏（true为显示）
*/
private boolean isOut = true;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.vertical);
init();
}
private void init(){
mainLayout = (RelativeLayout)super.findViewById(R.id.mainLayout);
scroll = (ScrollView)super.findViewById(R.id.scrollView1);
show = (TextView)super.findViewById(R.id.show); button1 = (Button)super.findViewById(R.id.Button1);
button2 = (Button)super.findViewById(R.id.Button2);
button3 = (Button)super.findViewById(R.id.Button3);
button4 = (Button)super.findViewById(R.id.Button4);
button5 = (Button)super.findViewById(R.id.Button5);
button6 = (Button)super.findViewById(R.id.Button6);
button7 = (Button)super.findViewById(R.id.Button7);
button8 = (Button)super.findViewById(R.id.Button8); button1.setOnClickListener(new MyClick());
button2.setOnClickListener(new MyClick());
button3.setOnClickListener(new MyClick());
button4.setOnClickListener(new MyClick());
button5.setOnClickListener(new MyClick());
button6.setOnClickListener(new MyClick());
button7.setOnClickListener(new MyClick());
button8.setOnClickListener(new MyClick()); //加载anim文件夹下面的动画文件inoftranslate和outoftranslate
inoftranslate = AnimationUtils.loadAnimation(this, R.anim.inoftranslate);
outoftranslate = AnimationUtils.loadAnimation(this, R.anim.outoftranslate);
//设置动画速率为线性变化
inoftranslate.setInterpolator(new LinearInterpolator());
outoftranslate.setInterpolator(new LinearInterpolator());
//设置动画结束停留在结束位置
inoftranslate.setFillAfter(true);
outoftranslate.setFillAfter(true);
//上一篇讲过的OnTouchListener
mainLayout.setOnTouchListener(new View.OnTouchListener() { @Override
public boolean onTouch(View v, MotionEvent event) {
// TODO Auto-generated method stub
switch(event.getAction()){
case MotionEvent.ACTION_DOWN:
isOut = !isOut;
if(!isOut){
//隐藏导航
System.out.println("--------"+isOut+"-------");
scroll.startAnimation(outoftranslate);
show.setText("导航隐藏");
}else{
//显示导航
System.out.println("--------"+isOut+"-------");
scroll.startAnimation(inoftranslate);
show.setText("导航显示");
}
}
return false;
}
});
}
private class MyClick implements OnClickListener{
//按钮个数较多，新建内部类实现OnClickListener接口，根据id判断点击哪个按钮。
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch(v.getId()){
case R.id.Button1:
show.setText("Button 1被点击..");
break;
case R.id.Button2:
show.setText("Button 2被点击..");
break;
case R.id.Button3:
show.setText("Button 3被点击..");
break;
case R.id.Button4:
show.setText("Button 4被点击..");
break;
case R.id.Button5:
show.setText("Button 5被点击..");
break;
case R.id.Button6:
show.setText("Button 6被点击..");
break;
case R.id.Button7:
show.setText("Button 7被点击..");
break;
case R.id.Button8:
show.setText("Button 8被点击..");
break; }
} }
}
最后是MainActivity.java：
package com.example.scrollviewdemo; import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.Button; /**
* @author Kay
* @blog http://blog.csdn.net/Kaypro
*/
public class MainActivity extends Activity { private Button horizontal = null;
private Button vertical = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
super.setContentView(R.layout.main);
init();
}
private void init(){
horizontal = (Button)super.findViewById(R.id.horizontal);
vertical = (Button)super.findViewById(R.id.vertical); horizontal.setOnClickListener(new MyClick());
vertical.setOnClickListener(new MyClick());
}
private class MyClick implements OnClickListener{ @Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()) {
case R.id.horizontal:
//新建一个意图
Intent intent1 = new Intent();
//设置跳转的Activity
intent1.setClass(MainActivity.this, HorizontalScrollView.class);
//开始跳转
startActivity(intent1);
break;
case R.id.vertical:
Intent intent2 = new Intent();
intent2.setClass(MainActivity.this, VerticalScrollView.class);
startActivity(intent2);
break;
}
}
}
}
最后由于新建了两个Activity，所以要在AndroidManifest.xml里面注册，注册完如下：
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.scrollviewdemo"
android:versionCode="1"
android:versionName="1.0" > <uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="10" /> <application
android:allowBackup="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name="com.example.scrollviewdemo.MainActivity"
android:label="@string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name="com.example.scrollviewdemo.HorizontalScrollView"></activity>
<activity
android:name="com.example.scrollviewdemo.VerticalScrollView"></activity>
</application> </manifest>
到这一步这个例子就算完成了，至于button按钮的效果，在控件篇（上）
（
http://blog.csdn.net/kaypro/article/details/9730229
）就有说过，这里就不重复贴代码了。
这里说下在使用ScrollView要注意的地方，ScrollView只能包裹一个直接子元素，往往是一个内嵌布局管理器，而不能包含多个，否则程序会出现java.lang.IIIegalStateException:ScrollView can host only one direct child的异常。
这里把这个例子传到资源下载那里http://download.csdn.net/detail/zenglinkai/6037485。
一步一步学android之控件篇——ScrollView的更多相关文章
- 一步一步学android之控件篇——ListView基本使用
ListView组件在应用程序中可以说是不可或缺的一部分,ListView主要是显示列表数据,同时可以滚动查看,这篇博客主要是对ListView的基本用法进行说明,后面会依次对ListView点击动态 ...
- android基本控件学习-----ScrollView
ScrollView(滚动条)的讲解: 一.对于ScrollView滚动条还是很好理解的,共有两种水平和垂直,ScrollView和HorizontalScrollview,这个里面不知道该总结写什么 ...
- Android 开源控件与常用开发框架开发工具类
Android的加载动画AVLoadingIndicatorView 项目地址: https://github.com/81813780/AVLoadingIndicatorView 首先,在 bui ...
- android 基础控件（EditView、SeekBar等）的属性及使用方法
android提供了大量的UI控件,本文将介绍TextView.ImageView.Button.EditView.ProgressBar.SeekBar.ScrollView.WebView ...
- Android基本控件之Menus
在我们的手机中有很多样式的菜单,比如:我们的短信界面,每条短信,我们长按都会出现一个菜单,还有很多的种类.那么现在,我们就来详细的讨论一下安卓中的菜单 Android的控件中就有这么一个,叫做Menu ...
- Android：控件布局（相对布局）RelativeLayout
RelativeLayout是相对布局控件:以控件之间相对位置或相对父容器位置进行排列. 相对布局常用属性: 子类控件相对子类控件:值是另外一个控件的id android:layout_above-- ...
- Android：控件布局（线性布局）LinearLayout
LinearLayout是线性布局控件:要么横向排布,要么竖向排布 决定性属性:必须有的! android:orientation:vertical (垂直方向) .horizontal(水平方向) ...
- 矩阵, 矩阵 , Android基础控件之ImageView
天下文章大家抄,以下所有内容,有来自copy,有来自查询,亦有自己的总结(目的是总结出自己的东西),所以说原创,不合适,说是转载也不恰当,所以我称之为笔记,可惜没有此分类选项,姑且不要脸一点,选择为原 ...
- 跟我学android-常用控件之 TextView
TextView 是Android文本控件,用于显示文字. 我们先看一看TextView的结构(developer.android.com) 从这里我们可以得知,TextView是View的子类,他有 ...
随机推荐
- 使用chrome调试xpath
使用chrome调试xpath 相信玩过爬虫的都知道一些库,如lxml(python),可以使用xpath方便地对HTML进行提取,但当真正用的时候,问题就来了,想找到一个元素往往要调试好几遍,而且得 ...
- 64位windows8的 IIS运行32位COM组件报错的解决
浏览时报错如下: Microsoft VBScript 运行时错误 错误 '800a01ad'ActiveX 部件不能创建对象: 'sqlcomp.FileSystemObject'/config.a ...
- Stream与byte转换
将 Stream 转成 byte[] /// <summary> /// 将 Stream 转成 byte[] /// </summary> public byte[] Str ...
- linux LVM 逻辑卷
fdisk pvcreate vgcreate lvcreate 查看显示 创建 删除 扩容 激活 扫描查找 LV lvdisplay lvcreate lvremove lvextend lvcha ...
- Windows下bat命令
一.简单批处理内部命令简介 1.Echo 命令 打开回显或关闭请求回显功能,或显示消息.如果没有任何参数,echo 命令将显示当前回显设置. 语法 echo [{on│off}] [mess ...
- ASP.NET MVC3使用Unity2.0实现依赖注入（转载和扩展）
http://note.youdao.com/share/?id=53252d0f897e0e109aadd296a1682354&type=note
- android select选择器 checkbox改外观，button按下状态
android 可以用选择器.来加载视图.选择器里的选项也很多针对实际使用中用的几个进行描述. 1.button 的按下弹起改外观.选择器属性用 android:state_pressed 2.C ...
- 当你还在争夺移动支付的时候，我已经统一了IC卡市场
摘要:虽然说今年移动支付行业的发展很快:苹果.Twitter和Facebook等巨头都开始进军这个市场,再加上PayPal.Coin和Square几个“老玩家”的存在,使得今年的移动支付市场热闹非凡. ...
- C语言入门（5）——运算符与表达式
C语言中运算符和表达式数量之多,在高级语言中是少见的.正是丰富的运算符和表达式使C语言功能十分完善.这也是C语言的主要特点之一. C语言的表达式由运算符.常量及变量构成.C语言表达式基本遵循一般代数规 ...
- label 标签
<label> 标签为 input 元素定义标注内容 label 元素不会向用户呈现任何特殊效果.不过,它为鼠标用户改进了可用性.如果您在 label 元素内点击文本,就会触发此控件.就是 ...