Android学习笔记十二之Android基础UI三
来源:互联网 发布:微信多开软件开发 编辑:程序博客网 时间:2024/04/28 16:40
Android学习笔记十二之Android基础UI三
ScrollView滚动视图
ScrollView是继承于FrameLayout,也是一个显示容器,由于手机屏幕是有限的,当需要组件安排多组信息的时候,ScrollView可以安排这些组件,我们浏览的时候可以进行滑动操作,滚动显示。但是,需要注意的是,ScrollView只能包含一种组件。
实现代码:
@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_scrollview); tv_scrollview_show = (TextView) findViewById(R.id.tv_show); btn_to_top = (Button) findViewById(R.id.btn_to_top); btn_to_bottom = (Button) findViewById(R.id.btn_to_bottom); scrollView = (ScrollView) findViewById(R.id.sc); initData(); btn_to_top.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { scrollView.fullScroll(ScrollView.FOCUS_UP); } }); btn_to_bottom.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { scrollView.fullScroll(ScrollView.FOCUS_DOWN); } });}private void initData() { StringBuffer buffer = new StringBuffer(); for (int i = 1; i < 120; i++) { buffer.append("这是第" + i + "个条目" + "\n"); } tv_scrollview_show.setText(buffer.toString());}
效果图:
ScrollView就介绍到这里,这个不是很常用。
ProgressBar进度条
进度条在很多场景下都需要用到,在进行一些耗时操作,如果不做进度显示,用户会以为应用ANR,给用户造成不好的体验,所以需要用到进度条。Android系统提供的进度条ProgressBar继承于View,有如下的属性:
android:max:进度条的最大值 android:progress:进度条已完成进度 android:progressDrawable:设置轨道对应的Drawable对象 android:indeterminate:如果设置成true,则进度条不精确显示进度 android:indeterminateDrawable:设置不显示进度的进度条的Drawable对象 android:indeterminateDuration:设置不精确显示进度的持续时间 android:secondaryProgress:二级进度条,类似于视频播放的一条是当前播放进度,一条是缓冲进度,前者通过progress属性进行设置!
对应Java方法有:
getMax():获取这个进度条的上限 getProgress():获取到当前进度 getSecondaryProgress():获取次要进度 incrementProgressBy(int diff):指定增加的进度 isIndeterminate():指示进度条是否处于不确定模式 setIndeterminate(boolean indeterminate):设置进度条进入不确定模式
系统提供的进度条在这里就不多介绍了,比较简单,下面是自定义进度条的例子:
package com.example.hello_baseui.widget;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.RectF;import android.graphics.Typeface;import android.util.AttributeSet;import android.view.View;import com.example.hello_baseui.R;/** * Created by Administrator on 2016/6/29. */public class CircleProgressBar extends View {/** * 画笔对象的引用 */private Paint paint;/** * 圆环的颜色 */private int circleColor;/** * 圆环进度的颜色 */private int circleProgressColor;/** * 中间进度百分比的字符串的颜色 */private int textColor;/** * 中间进度百分比的字符串的字体大小 */private float textSize;/** * 圆环的宽度 */private float circleWidth;/** * 最大进度 */private int max;/** * 当前进度 */private int progress;/** * 是否显示中间的进度 */private boolean isShowProgressText;/** * 进度的风格,实心或者空心 */private int circleStyle;private float strokeWidth;/** * 空心 */public static final int STROKE = 0;/** * 实心 */public static final int FILL = 1;/** * 构造器 * * @param context */public CircleProgressBar(Context context) { this(context, null);}/** * 构造器 * * @param context * @param attrs */public CircleProgressBar(Context context, AttributeSet attrs) { this(context, attrs, 0);}/** * 构造器 * * @param context * @param attrs * @param defStyleAttr */public CircleProgressBar(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); initView(context, attrs);}/** * 初始化组件 * * @param context * @param attrs */private void initView(Context context, AttributeSet attrs) { paint = new Paint(); TypedArray mTypedArray = context.obtainStyledAttributes(attrs, R.styleable.CircleProgressBar); circleColor = mTypedArray.getColor(R.styleable.CircleProgressBar_circleColor, Color.RED); circleProgressColor = mTypedArray.getColor(R.styleable.CircleProgressBar_circleProgressColor, Color.BLUE); textColor = mTypedArray.getColor(R.styleable.CircleProgressBar_textColor, Color.BLUE); textSize = mTypedArray.getDimension(R.styleable.CircleProgressBar_textSize, 14); circleWidth = mTypedArray.getDimension(R.styleable.CircleProgressBar_circleWidth, 10); isShowProgressText = mTypedArray.getBoolean(R.styleable.CircleProgressBar_isShowProgressText, true); circleStyle = mTypedArray.getInt(R.styleable.CircleProgressBar_circleStyle, 0); mTypedArray.recycle();}/** * 绘制 * * @param canvas */@Overrideprotected void onDraw(Canvas canvas) { super.onDraw(canvas); //绘制最外层的大圆 int centre = getWidth() / 2; //获取圆心的x坐标 int radius = (int) (centre - circleWidth / 2) - 2; //圆环的半径 paint.setColor(circleColor); paint.setStyle(Paint.Style.STROKE);//设置为空心 paint.setStrokeWidth(strokeWidth); //设置圆环的宽度 paint.setAntiAlias(true);//消除锯齿 canvas.drawCircle(centre, centre, radius, paint); //画出圆环 //=========================================================== //绘制进度的百分比 paint.setStrokeWidth(0); paint.setColor(textColor); paint.setTextSize(textSize); paint.setTypeface(Typeface.DEFAULT_BOLD); //设置字体 int percent = (int) (((float) progress / (float) max) * 100); //中间的进度百分比,先转换成float在进行除法运算,不然都为0 float textWidth = paint.measureText(percent + "%"); //测量字体宽度,我们需要根据字体的宽度设置在圆环中间 if (isShowProgressText && circleStyle == STROKE) { canvas.drawText(percent + "%", centre - textWidth / 2, centre + textSize / 2, paint); //画出进度百分比 } //============================================================================ //绘制圆弧和进度 paint.setStrokeWidth(strokeWidth); //设置圆环的宽度 paint.setColor(circleProgressColor); //设置进度的颜色 RectF oval = new RectF(centre - radius - 1, centre - radius - 1, centre + radius + 1, centre + radius + 1); //用于定义的圆弧的形状和大小的界限 switch (circleStyle) { case STROKE: { paint.setStyle(Paint.Style.STROKE); canvas.drawArc(oval, 90, 360 * progress / max, false, paint); //根据进度画圆弧 break; } case FILL: { paint.setStyle(Paint.Style.FILL_AND_STROKE); if (progress != 0) canvas.drawArc(oval, 90, 360 * progress / max, true, paint); //根据进度画圆弧 break; } }}//==============================get and set========================/** * 设置进度的最大值 * * @param max */public synchronized void setMax(int max) { if (max < 0) { throw new IllegalArgumentException("The max cannot less than 0"); } this.max = max;}public synchronized int getMax() { return max;}/** * 获取进度.需要同步 * * @return */public synchronized int getProgress() { return progress;}/** * 设置进度,此为线程安全控件,由于考虑多线的问题,需要同步 * 刷新界面调用postInvalidate()能在非UI线程刷新 * * @param progress */public synchronized void setProgress(int progress) { if (progress < 0) { throw new IllegalArgumentException("The progress cannot less then 0"); } if (progress > max) { progress = max; } if (progress <= max) { this.progress = progress; postInvalidate(); }}public int getCircleColor() { return circleColor;}/** * 设置圆环的颜色 * * @param circleColor */public void setCircleColor(int circleColor) { this.circleColor = circleColor;}public int getTextColor() { return textColor;}/** * 设置圆环字体的颜色 * * @param textColor */public void setTextColor(int textColor) { this.textColor = textColor;}public float getTextSize() { return textSize;}/** * 设置圆环字体的大小 * * @param textSize */public void setTextSize(float textSize) { this.textSize = textSize;}public float getCircleWidth() { return circleWidth;}/** * 设置圆的宽度 * * @param circleWidth */public void setCircleWidth(float circleWidth) { this.circleWidth = circleWidth;}public boolean isShowProgressText() { return isShowProgressText;}/** * 设置是否显示进度百分比 * * @param showProgressText */public void setShowProgressText(boolean showProgressText) { isShowProgressText = showProgressText;}public int getCircleStyle() { return circleStyle;}/** * 设置圆环的样式,空心和实心 * * @param circleStyle */public void setCircleStyle(int circleStyle) { this.circleStyle = circleStyle;}public float getStrokeWidth() { return strokeWidth;}/** * 设置绘制圆环的宽度 * @param strokeWidth */public void setStrokeWidth(float strokeWidth) { this.strokeWidth = strokeWidth;}public int getCircleProgressColor() { return circleProgressColor;}/** * 设置绘制圆环进度的颜色 * @param circleProgressColor */public void setCircleProgressColor(int circleProgressColor) { this.circleProgressColor = circleProgressColor;}//==============================get and set========================}
使用例子:
布局文件代码:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:android_custom="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><com.example.hello_baseui.widget.CircleProgressBar android:id="@+id/cpb" android:layout_width="100dp" android:layout_height="100dp" android:layout_marginLeft="10dp" android:layout_marginTop="10dp" android_custom:circleColor="#D1D1D1" android_custom:textSize="20sp" /></LinearLayout>
Java代码:
private CircleProgressBar circleProgressBar;int progressStatus = 0;@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_progressbar); circleProgressBar = (CircleProgressBar) findViewById(R.id.cpb); circleProgressBar.setMax(100); circleProgressBar.setCircleWidth(30); circleProgressBar.setStrokeWidth(10); circleProgressBar.setCircleProgressColor(Color.BLUE); final Handler handler = new Handler() { @Override public void handleMessage(Message msg) { if (msg.what == 0) { circleProgressBar.setProgress(progressStatus); } } }; new Thread(new Runnable() { @Override public void run() { while (progressStatus < 100) { progressStatus += 3; try { Thread.sleep(1000); handler.sendEmptyMessage(0); } catch (InterruptedException e) { e.printStackTrace(); } } } }).start();}
实现效果图:
一些长方形的进度条
SeekBar拖动条
SeekBar是ProgressBar的子类,ProgressBar里面的属性SeekBar都能用。SeekBar类似于ProgressBar,但是SeekBar可以允许用户拖动改变进度,我们可以将它用户多媒体播放,下面介绍一下SeekBar,实现一个简单的例子:
布局文件代码:
<SeekBar android:id="@+id/sb" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="20dp" /><TextView android:id="@+id/tv_seek_bar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="10dp" />
java代码:
private SeekBar sb;private TextView textView;@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_seekbar); sb = (SeekBar) findViewById(R.id.sb); textView = (TextView) findViewById(R.id.tv_seek_bar); textView.setMovementMethod(ScrollingMovementMethod.getInstance());//设置文字可以滚动 //设置SeekBar事件监听,需要实现三个方法 sb.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() { /** * 拖动操作 * @param seekBar * @param i * @param b */ @Override public void onProgressChanged(SeekBar seekBar, int i, boolean b) { textView.setText("正在拖动,拖动了:" + sb.getProgress() + "\n"); } /** * 刚开始拖动 * @param seekBar */ @Override public void onStartTrackingTouch(SeekBar seekBar) { textView.setText("开始拖动,拖动了:" + sb.getProgress() + "\n"); } /** * 停止拖动 * @param seekBar */ @Override public void onStopTrackingTouch(SeekBar seekBar) { textView.setText("停止拖动了,已经拖动了:" + sb.getProgress() + "\n"); } });}
实现的效果图:
关于SeekBar就简单介绍到这里。Android系统常用的UI就介绍到这里,下面我们介绍一下Android的五大布局
下面这些是国内镜像的API
ScrollView滚动视图
SeekBar拖动条
ProgressBar进度条
这是例子源码
0 0
- Android学习笔记十二之Android基础UI三
- Android学习笔记十二之Android基础UI三
- Android学习笔记三之Android基础
- Android学习笔记三之Android基础
- Android学习笔记十之Android基础UI一
- Android学习笔记十一之Android基础UI二
- Android学习笔记十之Android基础UI一
- Android学习笔记十一之Android基础UI二
- Android之UI学习篇十二:ListView控件学习(二)
- Android 学习笔记 二十二 之Handler
- 1.12Android 学习+进度之十二-聊天UI升级
- Android学习笔记(三)UI
- UI基础学习之(十二):UINavigationController
- Android学习笔记——UI基础
- Android学习三UI之Layout
- Android学习之 UI--基础控件
- android学习笔记(三)基础UI组件1——按钮,文本框,CheckBox,Radiobutton介绍
- Android学习笔记之三
- svn搭建
- 缓存淘汰算法--LRU算法
- 前端优化实践总结
- iOS 开发 一些关于图片的处理
- C# 程序员最常犯的 10 个错误
- Android学习笔记十二之Android基础UI三
- JRE system library错误
- 在 python3.5 下使用 Caffe Using Caffe with Python3.5
- 链表操作---Remove Nth Node From End of List,注意事项整理
- SpringMVC学习系列(3) 之 URL请求到Action的映射规则
- java web项目的web.xml详解
- 欢迎使用Markdown编辑器写博客
- Mac使用eclipse连接genymotion进行调试
- RTOS实时操作系统的认识