1.收獲
今天我們學(xué)習(xí)了做一個畫板贱傀,在這個畫板的實(shí)現(xiàn)過程中惨撇,用到了許多的東西,也學(xué)到了很多的東西府寒,雖然今天沒有把畫板這個demo做完魁衙,但是后面的東西自己都可以做了报腔,雖然還是要花很多的時間,但是這是值得的纺棺。今天學(xué)的東西很少榄笙,但是每一個知識點(diǎn)都是非常重要的邪狞,因?yàn)榇蟮臇|西都是由小的東西堆積起來的祷蝌,所以千萬不要小巧每一個知識點(diǎn)。盡管在做的過程中還噴到了問題帆卓,但是這些問題不是很大巨朦,都是由自己的不小心造成的,所以還是要有一嚴(yán)謹(jǐn)?shù)膽B(tài)度去面對每一次剑令,只有這樣形成習(xí)慣糊啡,才能在以后的工作中,會有出色的成績吁津。都是為了自己棚蓄,現(xiàn)在不管是什么困難的,不困難的碍脏,都要盡量去克服梭依,這才能夠鍛煉自己的能力和毅力。
2.技術(shù)
(1)約束布局
(2)橫豎屏幕的切換
(3)滑動條
(4)監(jiān)聽事件(接口)
3.技術(shù)的應(yīng)用和實(shí)踐
(1)約束布局(ConstraintLayout)
定義:按照自己的理解就是為了讓控件與控件之間的關(guān)系更加緊密典尾,對于控件與控件的約束來說是更加嚴(yán)密了役拴,而不像與其他的布局是父容器的練習(xí)比較緊密。他減少了布局的嵌套钾埂,并且可以代替其他的布局河闰。
用法:
相關(guān)的約束
chain屬性
(2)橫豎屏幕的切換
在這里的橫豎屏的切換有兩種方法來實(shí)現(xiàn)
a配置文件
先要找到配置文件
在配置文件中我們可以利用screenoratation屬性來進(jìn)行設(shè)置。
screenOrientation="sensor"http://隨著屏幕的變化而變化褥紫,但是不能倒著
screenOrientation="portrait"http://不會隨著屏幕變換
screenOrientation="landscape"http://固定橫屏
screenOrientation="sensorLandscape//感應(yīng)橫屏
b.代碼設(shè)置
在onResume()設(shè)置 因?yàn)樵谄聊坏母淖兊闹岸紩{(diào)用它
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_SENSOR);
@Override
protected void onResume() {
super.onResume();
//設(shè)置橫豎屏 屏幕隨著手機(jī)的方向而改變
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_FULL_SENSOR);
}
效果:
(3)滑動條
a.利用xml進(jìn)行配置
<!--滑動條-->
<SeekBar
android:layout_width="match_parent"
android:layout_height="20dp"
android:progressBackgroundTint="#0f0"
android:progressTint="@color/colorPrimary"
android:thumbTint="#000000"
android:max="100"
/>
android:progressBackgroundTint="#0f0"http://滑動條滑動前的顏色
android:progressTint="@color/colorPrimary"http://滑動條滑動后前的顏色
android:thumbTint="#000000"http://小圓點(diǎn)的顏色
android:max="100"http://最大值
progress 進(jìn)度條圖片
progressBackground 進(jìn)度條背景圖片
Thumb 小圓點(diǎn)圖片
b.自定義滑動條Slider
首先我們需要先建一個類
然后我們在這個類中利用paint來繪制進(jìn)度條
1.添加約束
<swu.xcf.drawbord.Slider
android:id="@+id/slider"
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:layout_marginRight="20dp"/>
</LinearLayout>
2.我們進(jìn)行畫進(jìn)度條的背景線
設(shè)置屬性
初始化畫筆
linePanit=new Paint(Paint.ANTI_ALIAS_FLAG);
linePanit.setStrokeWidth(linesize);
linePanit.setColor(lineColor);
確定屏幕的方向,開始畫線
@Override
protected void onDraw(Canvas canvas) {
if(getWidth()>getHeight()){
//橫著
//背景線
canvas.drawLine(0,(getHeight())/2,
getWidth(),(getHeight())/2,linePanit);
}else{
//豎著
canvas.drawLine((getWidth())/2,0,
(getWidth())/2,getHeight(),linePanit);
//畫小圓點(diǎn)
canvas.drawCircle(cx,cy,radius,circlepaint);
}
3.畫小圓點(diǎn)
首先我們要先確定小圓點(diǎn)的大小和畫法
從上圖可知姜性,小圓點(diǎn)小圓點(diǎn)的位置并使在線的兩端
小圓點(diǎn)的屬性
private int cx;//中心點(diǎn)x
private int cy;//中心點(diǎn)y
private int radius;//小圓點(diǎn)的半徑
private Paint circlepaint;//小圓點(diǎn)的畫筆
private int thumbcolor=Color.MAGENTA;//小圓點(diǎn)的顏色
初始化小圓點(diǎn)的筆
//圓點(diǎn)畫筆
circlepaint=new Paint(Paint.ANTI_ALIAS_FLAG);
circlepaint.setStyle(Paint.Style.FILL);
circlepaint.setColor(thumbcolor);
確定小圓點(diǎn)的位置
畫小圓點(diǎn)
canvas.drawCircle(cx,cy,radius,circlepaint);
小圓點(diǎn)的移動
private int thumScale=4;//小圓點(diǎn)縮放尺寸基數(shù)
private float position;//記錄觸摸點(diǎn)的坐標(biāo)
@Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()){ case MotionEvent.*ACTION_DOWN*: //小圓點(diǎn)放大 thumScale=2;
if(getHeight()<getWidth()){ //橫向時 position=event.getX(); }else{ //縱向時 position=event.getY(); } break;
case MotionEvent.*ACTION_MOVE*: //獲取觸摸點(diǎn)的值 X Y if(getHeight()<getWidth()){ //橫向時 position=event.getX(); }else{
//縱向時 position=event.getY(); } break;
case MotionEvent.*ACTION_UP*: thumScale=4;
break; }
invalidate();//重新繪制
return true; }
進(jìn)度條的繪制
在進(jìn)度條的繪制是我們考慮到了需不需要小圓點(diǎn)的情況
一個是進(jìn)度條,一個是滑動條
我們設(shè)置了兩種風(fēng)格供外界選擇髓考,利用屬性的set 方法來進(jìn)行設(shè)置
public static int PROGRESS=0;//進(jìn)度條
public static int SLIDER=1;//滑動條
private int style=PROGRESS;//樣式
set和get方法
public int getStyle() {
return style;
}
public void setStyle(int style) {
this.style = style;
}
我們需要進(jìn)行設(shè)置進(jìn)度跳的最大值和進(jìn)度
private int max=100;//設(shè)置最大值
public float progress;//進(jìn)度值
以及他們的set和get方法
我們在設(shè)置進(jìn)度是需要注意那個進(jìn)度條的長短部念,它會隨著屏幕方向不同而不同
所以我們需要進(jìn)行判斷屏幕的方向
public float getProgress() {
return progress;
}
public void setProgress(float progress) {
this.progress = progress;
if (progress < 1.001) {
//將進(jìn)度值轉(zhuǎn)換為控件中的尺寸位置
if (getHeight() < getWidth()) {
//橫向時
position = getWidth() * progress;
} else {
//縱向時
position = getHeight() * progress;
}
postInvalidate();
}
}
public void setMax(int max) {
this.max = max;
}
畫進(jìn)度條
//橫屏
if(position>0) {
//畫進(jìn)度條
canvas.drawLine(0, (getHeight()) / 2,
position, (getHeight()) / 2, progressPaint);
}
//豎屏
if(position>0){
canvas.drawLine((getWidth())/2,0,
(getWidth())/2,position,progressPaint);
}
然后我們mainactivity中進(jìn)行設(shè)置
final Slider slider=findViewById(R.id.slider);
slider.setMax(50);
slider.setStyle(Slider.SLIDER);
我們利用時間器讓進(jìn)度條自己進(jìn)行
new Timer().schedule(new TimerTask() {
@Override
public void run() {
slider.setProgress((float) (slider.getProgress()+0.001));
}
},0,100);
效果:
(4)監(jiān)聽事件(接口)
這里用到接口是為了接收外部給內(nèi)部傳遞的進(jìn)度(動態(tài))就是外部在移動過程中介劫,進(jìn)度就要到哪
1.創(chuàng)建接口
//接口
public interface OnSliderChangeListener{
void progresschange(float progress);
}
2.記錄從外部傳來的監(jiān)聽者
//滑動改變的監(jiān)聽者
private OnSliderChangeListener onSliderChangeListener;
public void setOnSliderChangeListener(OnSliderChangeListener onSliderChangeListener) {
this.onSliderChangeListener = onSliderChangeListener;
}
3.在外部調(diào)用接口挚瘟,并實(shí)線皆空的方法
slider.setOnSliderChangeListener(new Slider.OnSliderChangeListener() {
@Override
public void progresschange(float progress) {
System.out.println(""+progress);
}
});
4對于回調(diào)回來的進(jìn)度進(jìn)行設(shè)置
private void callback(){
if(onSliderChangeListener!=null){
if(getHeight()>getWidth()){
progress=position/getHeight();
}else{
progress=position/getWidth();
}
onSliderChangeListener.progresschange(progress*max);
}
}