看得見的資料結構Android版之開篇前言
阿新 • • 發佈：2018-11-21
零、前言
最近兩個星期研究了一下Android的繪圖，也可以說是自定義控制元件吧。
但僅是如此嗎？那些都是開胃菜，吾現在要放大招了，那就是讓無數新手聞風喪膽的——數!據!結!構!
沒錯，吾要和資料結構進行第三次大規模戰鬥，而這場戰鬥的戰利品將是本篇和之後的n篇，以及我從中獲得的經驗與知識。
本系列為了測試吾的能力(繪圖能力，分析能力，表述能力，統籌能力)以及為大家換一個角度去看待資料結構。
本系列將會成為吾程式設計生涯的一座里程碑和個人標誌。希望你可以和我在Github一同見證：DS4Android
注：本系列的[捷文規範]定位在掘金，簡書同步更新
0.本系列後續更新連結合集：(動態更新)
看得見的資料結構Android版之開篇前言
看得見的資料結構Android版之陣列篇(待完成)
看得見的資料結構Android版之單鏈表篇(待完成)
看得見的資料結構Android版之雙鏈表篇(待完成)
看得見的資料結構Android版之二叉樹篇(待完成)
看得見的資料結構Android版之二分搜尋樹篇(待完成)
看得見的資料結構Android版之AVL樹篇(待完成)
看得見的資料結構Android版之紅黑樹篇(待完成)
更多資料結構---以後再說吧
1.說說我對資料結構的理解吧：
1---資料結構=資料+結構：
2---說到結構，我第一反應就是生物的骨架，而資料則是附著在骨架上的軀體。
3---軀體外顯，骨架內隱，骨架的行為在軀體上表現。很符合資料與結構的關係。
4---簡而言之，我認為結構是資料的載體，資料是結構行為的體現。
5---血肉大同小異，但骨骼千差萬別，有的靈巧嬌小，有的笨重碩大，但各有千秋。
2.總結與展望：我與資料結構的兩次大戰
第一次接觸資料結構是在學程式設計初期，可謂完敗,內心倍受摧殘，從而敬而遠之
第二次接觸資料結構是在前幾個月，原因是感覺程式設計的境界提升很多，資料結構這個瓶頸早晚還是要過的
便決定潛心研究兩個星期，感覺還不錯，可以說平分秋色，收穫頗多，雖然過深的知識我也只能淺嘗輒止。
這次是第三次對資料結構的大戰，基於Android的View來顯示資料結構，讓它的神祕無所遁藏。
就我剛寫完陣列篇來講，確實對我的思維和分析有很大的考驗，對於層次分解也更清晰，
常量的價值、監聽的使用，以及介面的鬼斧神工還有泛型的使用(泛型包泛型我也是佩服自己)都理解得更深了
複製程式碼 3.總體的思路
4.下面是陣列資料結構的檢視：(有沒有很期待)
一、本文是幹嘛的(開場篇當然不能太low)
既然決定對戰資料結構，那擂臺便必不可少，Android的View就是擂臺。本篇解決擂臺的問題。
本篇會解決陣列、單鏈表、雙鏈表、二叉樹、紅黑樹的單體繪製，有什麼視覺方面的想法歡迎留言。
基本樣子大概就是下圖了：
二、下面來繪製一下各種資料結構的單體
以下是安卓原生繪圖結果，也是本篇的重點：
0.統一常量管理類
/**
* 作者：張風捷特烈<br/>
* 時間：2018/11/21 0021:14:21<br/>
* 郵箱：[email protected]<br/>
* 說明：統一常量管理類
*/
public class Cons {
public static final int BOX_HEIGHT = 100;//一個數組盒子的高
public static final int BOX_WIDTH = 200;//一個數組盒子的寬
public static final int LINK_LEN = 100;//連結串列長度
public static final int ARROW_DX = 20;//連結串列箭頭
public static final int BOX_RADIUS = 10;//盒子圓角
public static final int FONT_SIZE = 40;//陣列文字字號
public static final int BST_RADIUS = 50;//二叉樹文字字號
}
複製程式碼1.陣列單體的繪製
控制點1,2重合了，你也可以用二次的貝塞爾曲線
private void arrayView(Canvas canvas) {
//畫圓角矩形沒什麼好說的
canvas.drawRoundRect(
0, 0, Cons.BOX_WIDTH, Cons.BOX_HEIGHT,
Cons.BOX_RADIUS, Cons.BOX_RADIUS, mPaint);
//繪製貝塞爾弧線
mPath.moveTo(0, 0);
mPath.rCubicTo(
Cons.BOX_WIDTH / 2, Cons.BOX_HEIGHT / 2,//控制點1
Cons.BOX_WIDTH / 2, Cons.BOX_HEIGHT / 2,//控制點2
Cons.BOX_WIDTH, 0);//終點
canvas.drawPath(mPath, mPathPaint);
//繪製文字沒什麼好說的
canvas.drawText("0",Cons.BOX_WIDTH / 2, 3 * 10, mDataPaint);
canvas.drawText("toly",
0 + Cons.BOX_WIDTH / 2, 0 + Cons.BOX_HEIGHT / 2 + 3 * 10, mDataPaint);
}
複製程式碼2.單鏈表單體的繪製：
private void singleLink(Canvas canvas) {
//畫圓角矩形沒什麼好說的
canvas.drawRoundRect(
0, 0, Cons.BOX_WIDTH, Cons.BOX_HEIGHT,
Cons.BOX_RADIUS, Cons.BOX_RADIUS, mPaint);
//畫路徑
mPath.rCubicTo(
Cons.BOX_WIDTH / 2, Cons.BOX_HEIGHT / 2,
Cons.BOX_WIDTH / 2, Cons.BOX_HEIGHT / 2,
Cons.BOX_WIDTH, 0);
mPath.rLineTo(0, Cons.BOX_HEIGHT / 2f);//往下畫線走半高
mPath.rLineTo(Cons.LINK_LEN, 0);//往左畫線走線長
mPath.rLineTo(-Cons.ARROW_DX, -Cons.ARROW_DX);//畫箭頭
canvas.drawPath(mPath, mPathPaint);
//繪製文字沒什麼好說的
canvas.drawText("0", Cons.BOX_WIDTH / 2, 3 * 10, mDataPaint);
canvas.drawText("toly",
0 + Cons.BOX_WIDTH / 2, 0 + Cons.BOX_HEIGHT / 2 + 3 * 10, mDataPaint);
}
複製程式碼3.雙鏈表單體的繪製：
private void DoubleLink(Canvas canvas) {
//畫圓角矩形沒什麼好說的
canvas.drawRoundRect(
0, 0, Cons.BOX_WIDTH, Cons.BOX_HEIGHT,
Cons.BOX_RADIUS, Cons.BOX_RADIUS, mPaint);
//畫路徑
mPath.rCubicTo(
Cons.BOX_WIDTH / 2, Cons.BOX_HEIGHT / 2,
Cons.BOX_WIDTH / 2, Cons.BOX_HEIGHT / 2,
Cons.BOX_WIDTH, 0);
mPath.lineTo(Cons.BOX_WIDTH, Cons.BOX_HEIGHT / 2.2f);
mPath.rLineTo(Cons.LINK_LEN, 0);
mPath.rLineTo(-Cons.ARROW_DX, -Cons.ARROW_DX);
mPath.moveTo(0, 0);
mPath.rLineTo(0, Cons.BOX_HEIGHT / 1.2f);
mPath.rLineTo(-Cons.LINK_LEN - Cons.ARROW_DX, 0);
mPath.rLineTo(Cons.ARROW_DX, Cons.ARROW_DX);
canvas.drawPath(mPath, mPathPaint);
//繪製文字沒什麼好說的
canvas.drawText("0",
Cons.BOX_WIDTH / 2,
3 * 10, mDataPaint);
canvas.drawText("toly",
0 + Cons.BOX_WIDTH / 2,
0 + Cons.BOX_HEIGHT / 2 + 3 * 10, mDataPaint);
}
複製程式碼4.二叉樹單體的繪製
private void BST(Canvas canvas) {
//先畫線,圓將先蓋住
mPath.moveTo(0 + Cons.BST_RADIUS / 2, 0 + Cons.BST_RADIUS / 2);
mPath.rLineTo(150, 150);
mPath.moveTo(0 - Cons.BST_RADIUS / 2, 0 + Cons.BST_RADIUS / 2);
mPath.rLineTo(-150, 150);
canvas.drawPath(mPath, mPathPaint);
//父節點繪製
canvas.drawCircle(0, 0, Cons.BST_RADIUS, mPaint);
canvas.drawText("0", 0, 10, mDataPaint);
//繪製子節點
int offsetX = 150;//子圓心偏移X
int offsetY = 150;//子圓心偏移Y
canvas.drawCircle(0 - offsetX, 0 + offsetY, Cons.BST_RADIUS, mPaint);
canvas.drawText("null", 0 - offsetX, 10 + offsetY, mDataPaint);
canvas.drawCircle(offsetX, offsetY, Cons.BST_RADIUS, mPaint);
canvas.drawText("null", offsetX, 10 + offsetY, mDataPaint);
}
複製程式碼5.紅黑樹的畫法
private void bAr(Canvas canvas) {
mPath.moveTo(0 + Cons.BST_RADIUS / 2, 0 + Cons.BST_RADIUS / 2);
mPath.rLineTo(150, 150);
mPath.moveTo(0 - Cons.BST_RADIUS / 2, 0 + Cons.BST_RADIUS / 2);
mPath.rLineTo(-150, 150);
canvas.drawPath(mPath, mPathPaint);
mPaint.setColor(Color.BLACK);
canvas.drawCircle(0, 0, Cons.BST_RADIUS, mPaint);
canvas.drawText("50", 0, 10, mDataPaint);
//繪製子節點
int offsetX = 150;//子圓心偏移X
int offsetY = 150;//子圓心偏移Y
mPaint.setColor(Color.RED);
canvas.drawCircle(0 - offsetX, 0 + offsetY, Cons.BST_RADIUS, mPaint);
canvas.drawText("35", 0 - offsetX, 10 + offsetY, mDataPaint);
mPaint.setColor(Color.BLACK);
canvas.drawCircle(offsetX, offsetY, Cons.BST_RADIUS, mPaint);
canvas.drawText("78", offsetX, 10 + offsetY, mDataPaint);
}
複製程式碼三、其他初始：
1.可顯示出來的基類
所有資料結構繪製單體的父類
/**
* 作者：張風捷特烈<br/>
* 時間：2018/11/21 0021:8:50<br/>
* 郵箱：[email protected]<br/>
* 說明：可顯示出來的基本條件
*/
public class Viewable {
public float x;//單體的x座標
public float y;//單體的y座標
public int color = 0xff43A3FA;//單體的顏色
public float vX;//單體的水平速度
public float vY;//單體的數值速度
public Viewable() {
}
public Viewable(float x, float y) {
this.x = x;
this.y = y;
}
}
複製程式碼2.控操作介面
/**
* 作者：張風捷特烈<br/>
* 時間：2018/11/21 0021:10:17<br/>
* 郵箱：[email protected]<br/>
* 說明：控操作介面
*/
public interface OnCtrlClickListener<T> {
void onAdd(T view);
void onRemove(T view);
void onSet(T view);
void onFind(T view);
}
複製程式碼後記：捷文規範
1.本文成長記錄及勘誤表
| 專案原始碼 | 日期 | 備註 |
|---|---|---|
| V0.1--github | 2018-11-21 | 看得見的資料結構Android版之開篇前言 |
2.更多關於我
| 筆名 | 微信 | 愛好 | |
|---|---|---|---|
| 張風捷特烈 | 1981462002 | zdl1994328 | 語言 |
| 我的github | 我的簡書 | 我的掘金 | 個人網站 |
3.宣告
1----本文由張風捷特烈原創,轉載請註明
2----歡迎廣大程式設計愛好者共同交流
3----個人能力有限，如有不正之處歡迎大家批評指證，必定虛心改正
4----看到這裡，我在此感謝你的喜歡與支援