前言

大家好, 我是前夕. 2023已经过完了, 我也想简单聊聊这一年发生的事情. 今年发生的事情不多, 但是都足以改变我未来人生的走向.

五个月减肥32斤

今年最大最大超级无敌大的改变, 就是减肥了. 我是95年生人, 工作已经5年了. 这个年龄段相当多的人身体都已经出现了一些警告信号. 其实肥胖就是最早的不痛不痒的信号. 我的老粉也都知道我花了半年时间减掉30多斤的事儿. 作为年终总结很重要的一趴, 我还是要简单提一下. 其实之前我一度认为胖不胖的无所谓, 人生苦短, 怎么开心怎么来. 但是相信我, 瘦下来的快乐是你无法想象的.

这是今年3月的我. 身高170, 体重162. 你也可以称我为正方形战士.

这是今年3月的我. 身高170, 体重162. 你也可以称我为正方形战士.

这是今年3月的我. 身高170, 体重162. 你也可以称我为正方形战士.

这是今年9月的我. 身高170, 体重130. 你也可以称我为猛男.

这是今年9月的我. 身高170, 体重130. 你也可以称我为猛男.

这是今年9月的我. 身高170, 体重130. 你也可以称我为猛男.

肯定有朋友会问, 减肥成功的正脸照是不是美颜了? 答案是的, 但是, 第一张也美颜了, 且是同一部手机. 一荣俱荣一损俱损. 另外, 我必须得说明, 我很清楚自己的颜值缺陷, 是眉毛太淡了, 因为小时候眉毛受过伤, 所以特别淡. 于是做了纹眉. 别的没了. 主要差别其实还是减肥带来的, 只要你胖, 怎么样都不好看. 只有瘦下来, 你捯饬自己才有效果.

接下来说说身材. 健身的人都懂, 肌肉身材往往需要阴影的配合. 确实是这样的. 所以我也放出我正面直拍的照片.

就半年时间我也练不到多猛. 现在这个肌肉量已经相当可以了, 毕竟我的起点是个肥宅. 回顾减肥的历程, 只有减过肥的人知道这有多难. 虽然我早就结束减肥了, 但是我仍然觉得五个月32斤是个很夸张的数字. 其实减肥带来的好处, 我真的是一时半会说不完, 只能说我在体重恢复正常时, 看着镜子里一身腱子肉的自己, 我好像宇智波斑解除了秽土转生一样, 只能用青春正当时来形容自己.

相信很多同学看到这会打鸡血, 表示自己24年也要减肥! 首先我希望你不要向我的变化程度看齐. 因为我付出的代价非常大. 运动, 只是一环, 还有很多其他方面. 而我身边(包括朋友圈)真正减肥成功的, 不到半只手. 难度真的挺大的. 如果你坚持就想要减肥, 非常好. 那么我推荐你可以看看我的方法论: 五个月减肥32斤, 涅槃重生也不过如此

交往了00后女友

在去年十月底和现在的女朋友谈了. 这段故事我想简单说下, 有点魔幻. 其实我刚刚工作的时候就认识她了. 是网上认识的, 相谈甚欢, 甚至她明确表达过喜欢. 但是因为异地的问题(她在成都我在上海), 所以双方都pass掉了. 后来也就过年发下祝福啥的, 日常都不联系. 我也理解, 因为对于没有结果的喜欢, 没有人会一直坚持. 我也只是希望大家就做朋友就好. 直到去年我老是刷到一家外卖叫料可可炒饭. 而她的小名也叫可可. 我很多次想截图发她, 但是都没行动. 因为没什么意义, 我又没指望什么, 我连聊都懒得聊. 但是确实经常点外卖就能看到. 后来我就忍不住了就发她了.

我没想到她怎么还找上话题了. 我只是单纯想和她分享一下而已. 但是她既然说了别的话题, 行吧, 那我就陪你聊下, 不然不回人家显得我很冷血. 结果越聊越high, 当晚就打视频, 她还是几年前的那个模样, 而此时, 我已经减肥成功, 她都不知道我胖过. 全程和我聊的也很开心, 一瞬间不知道到底是她和我聊的来, 还是我和她聊的来, 还是双方真的聊的来. 对线细节不说了, 简单几次出招后她就摊牌了.

她: "如果你在成都就好了, 我想和你谈恋爱".

当她说完这个话, 我就想挂电话了. 其一是我觉得她上头了. 其二是我真的很困, 当时已经凌晨4点了. 但是我却很难入眠. 那晚我一直在思考一个问题. 我喜欢她吗? 说实话, 都那么久没联系了, 你说喜欢不喜欢的, 只能说还行, 毕竟还没谈, 喜欢不是理性的产物, 至少我还是很愿意和她相处的, 且确实聊的非常开心. 不知道大家能不能get到遇到一个同频的人有多难得.

然后我就思考第二个问题, 我和她没在一起的原因是什么? 之前她一直想待在成都, 而我对成都其实也没什么感情. 之前一直想去杭州(大学在那边读的), 因为无法解决地域问题就没继续了. 但是工作久了, 发现在杭州的朋友慢慢的也都离开杭州了, 杭州对我来说, 也已经没有多大意义了. 我对于待在哪个城市, 不是很有所谓. 那这不正好吗? 去成都呀. 也就是说, 4年前的我和她, 地域问题导致我们并不合适. 但是现在, 双方都有能力选择自己想要的生活.

所以第二天晚上问她要不要视频. 我当时想好了, 她可能确实是聊上头了才说喜欢的. 所以如果她拒绝接听视频, 那我就当什么都没发生. 成年人嘛, 这都基操了. 但是她秒接视频. 于是我就说了下面这句话

"你有没有想法把我们的关系再推进一些?"

她明显愣了下, 我看出了她也是在考虑地域问题. 她肯定想不明白地域这个问题该咋解决.

我赶紧补充道: "我知道你想待在成都. 对于以后定居成都的事儿, 我也不是很介意. 但是, 这不是一个飞机票的事情. 咱们倒推下, 假如我们在成都生活, 前提是我们一起攒够钱. 而这个前提, 是我作为程序员, 只有在大城市才有比较好的就业机会. 再往前, 那你得先来到上海和我一起赚钱, 再往前, 我们得是情侣, 再往前, 需要判断我们是否真的合适在一起. 那么怎么判断我们是否合适在一起呢?"

经常谈恋爱的朋友们肯定知道, 判断一个人能不能和自己谈, 不可能需要个把月的时间. 基本上相处几天就能确定大概方向了, 再慢不过半个月, 如果有朋友觉得这个速度太快了, 那只能说明你的段位太低了.

"我们可以出来玩一下, 就知道是否适合谈恋爱了. 如果适合, 我们就试着在一起. 不适合, 就当一切都没发生. 就算在一起, 我们也一定是要双向奔赴的. 不是我努力就能有结果, 也不是你单方努力就能有成效. 双向奔赴一定是我们的唯一解. 我下周再买机票来见你, 我给你一周的时间考虑要不要见面"

不知道是不是她没听到最后一句话, 她马上打开了boss开始看上海的工作机会了. 后来我们的见面也如期而至, 当天晚上就在一起了.

目前谈了2个多月了, 她还没来上海, 因为她行业的问题(媒体), 她哪怕去北京都很容易找, 但是在上海反而很难找. 这个原因涉及到一些敏感信息, 我不方便在这里解释. 总之, 她一时半会确实很难过来, 只能说在尝试.

目前我们是一个月见一次, 每天晚上就是打视频+玩蛋仔派对. 因为异地, 每天只能在游戏里约会.

我能感受到她确实是在向我奔赴而来. 之前我们公司经历了几次裁员, 我和她商量, 要不要我现在去成都. 不想异地恋了. 她和我说

"你不要为了我来成都, 你优先考虑哪个地方对你的工作是最有利的, 不管你在哪里, 我都会想方设法靠近你" 当时我真挺感动的.

我的房租是半年付的, 一次性交了1w多, 我和她分享说1w多好贵啊. 我只是单纯地分享, 而她犹豫了下说要不然我们2个月见一次吧. 我还愣了下, 为啥突然这么说. 随后我就反应过来她是希望降低我的经济压力. 对此我肯定是不会同意的.

类似的案例有很多, 不一一撒狗粮了. 因为每个月只能面对面地抱在一起三天时间(周末+年假一天). 所以最后天其中一个人就要去机场返程了.

每次我们送别彼此都会很难受. 上次我去成都返程, 我前脚刚走, 她就泪崩了. 其实她比我坚强. 如果是我送她离开上海, 一般是她还没走我就已经难受的不行了.

现在男女冲突挺严重的, 我时常在沸点看到jym不是女朋友想方设法让你送礼物, 就是对象只顾着自己不顾家, 甚至上次还有个离婚了等着要分老公年终奖的. 这样的男女矛盾屡见不鲜. 我也很庆幸遇到了一个双向奔赴的女孩, 我们都在尽自己所能给彼此最好的生活. 为了保护女友, 我还是不放人家照片了. 随便放一张意思下.

网上一直有个争议很大的话题, 就是选择一个你爱的人 还是 爱你的人. 我现在的答案是应该选择一个我爱的人, 因为想起她, 我会充满干劲. 而更幸运地是, 她同时也爱着我.

思想更加开阔

去年看了点书, 不多, 就几本, 不到一只手. 但是我受益良多. 很多人觉得幸福是客观存在的, 我有大鱼大肉吃就是幸福, 我可以不上班就是幸福. 但是这是真的吗? 其实不完全是. 幸福是主观的. 引用某著作的一段话

淘宝和拼多多上的基础款羽绒服也比清朝最好的棉衣要暖和轻便；慈禧兴师动众劳民伤财的在北京城的数个地点开凿了上万平米的冰窖，只是为了将冬天的冰存到夏天来祛暑。而现在每一个装有空调的家庭都能在这一点上比慈禧过的更舒服。甚至是经济条件不足以购买空调、支付电费的当代中国人，也可以去地铁站、图书馆、商场等公共场所享受这种超过老佛爷的体验。

但是我问大家一个问题, 慈禧的幸福感比你差吗? 如果幸福是绝对依赖客观世界, 那么随着科技的发展, 大家应该越来越幸福才对. 但是现实是这样的吗? 显然不是. 当然, 我们不能否认客观世界对幸福的影响. 比如疼痛, 肯定是不幸福的. 有钱的话可以体验更好的医疗, 让疼痛不那么多, 这也是幸福. 但是我想强调的是, 幸福并不100%取决于客观世界. 在这里我是希望大家不要忽略主观想法对幸福感的影响. 这也是为什么说心态很重要的一个原因. 还有很多想说的, 但是我写完又删了, 因为哲学的东西讨论起来, 确实非常依赖你的经历和你所处的精神层次, 甚至会引发大家的争吵, 想想算了, 反正我觉得很多事儿我想的比之前明白了, 也没有了精神内耗, 现在每天都挺开心的.

结语

我不喜欢规划, 所以也不会说什么24年要怎么怎么样, 如果有, 那也只是说说而已. 因为说是说, 做是做. 而生活, 总是见招拆招. 在这里, 我只想祝福大家天天开心!

开心的一刻

一老大爷坐火车，买的是慢车票，却上了快车

乘务员查到了，对他说：“老人家，你的票要补哦”

老人家听了眼一瞪说：“上面的洞洞是你们剪的，咋喊我补呢？”

乘务员傻眼了，解释到：“不是票坏了喊你补，你买的票是慢车票，这趟车是快车，你应该补快车票”

老人大悟，说道：“哦！是这样啊；那你喊司机开慢点吧，我又不赶时间”

十年的回忆

今天无意之间听到了Eason的十年，突然意识到我已经大学毕业十年了

十年，经历了很多，也成长了很多

当初的青涩已不复存在，留下的只有无尽的沧桑

唯一不变的是，我依旧孑然一身

这十年

有轻松快乐的游戏生活

也有战战兢兢的职场蹉跎

经历了说走就走的旅行

也经历了痛彻心扉的爱情

从当初的意气风发，到如今的随波逐流

终究活成了当初最讨厌的样子！

要问这十年间印象最深的一次经历是什么

毫无疑问是十年前的川藏线之旅！

无意的决定

2013年6月的某一天，好哥们（阿超）突然发来QQ消息：我们去骑川藏线吧

我很淡定的回道：好啊

从左往右：阿超、楼猪、阿方

"充分"的准备

说到准备，我只能说我们是：无知者无畏

装备准备

阿超是我们三个中最早接触骑行的，大三的时候他就购买了他人生中的第一辆山地车

我记得当时的购入价是1500，他骑着他心爱的座驾，逛了邵阳不少的地方，其中也包括崀山

因为他接触的早，所以除了车之外的装备，都是阿超在淘宝上选购的

包括抓绒衣、防晒服、头巾、手套、冰丝袖、打气筒、补胎套件、驮包、手电筒、尾灯等等

说到抓绒衣，就不得不提一下，也不知道当时是不知道有冲锋衣了，还是预算不够，我们就买了普通的抓绒衣

好几次差点成为冰雕，后面我再细说

然后就是我跟阿方的自行车，当时应该是考虑到预算的问题

我们在淘宝上买了2辆，一辆是“悍马”，一辆是“宝马”，还都是折叠车！

最前面的是我的“悍马”，中间的是阿超的美利达，最里面的是阿方的“宝马”

我和阿方的车单价是565，两辆一共1130

现在想想我俩的胆是真肥，这样的车是怎么敢上路的！！！

至于拍摄装备，当时没想那么多，就各自的手机：阿超的Nokia 5230、我的Nokia 830、阿方的OPPO（型号不记得了，是个翻盖）

攻略准备

攻略也是阿超全权负责，哪一天从哪出发，每一天要到达哪个目的地

考虑到安全、时间、预算等因素，我们一开始就计划住青年旅舍或者当地居民家，没打算户外扎帐篷

川藏线分南线和北线

南线由四川成都—雅安—泸定—康定—东俄洛—雅江—理塘—巴塘—西藏芒康—左贡—邦达—八宿—波密—林芝—工布江达—墨竹工卡—达孜—拉萨，属318国道

北线由成都至东俄洛与南线重合，再由东俄洛与南线分开北上，经八美（原乾宁县）—道孚—炉霍—甘孜—德格—西藏江达—昌都—类乌齐—丁青—巴青—夏曲—那曲—当雄—羊八井—拉萨，属317国道

南线相较于北线，平均海拔更低，开发也更早，更容易骑行

所以我们选择了南线，也就是上图中标粗的主线

拉练准备

我们三都没有进行实战型的拉练，阿超相较于我俩，只是平路骑的比较多

长距离的上山、下山，我们都没有试过

在出发前的前一周，我们一起绕着大学骑了三圈

这就算完成了我们的拉练...

刺激的旅途

2013年07月16号，我们正式出发了

坐上了可爱的K487次列车，历经17时49分，于2013-07-17 13:37到达了成都东站

然后我们骑车来到了成都师范学院，在附近找了一间民宿，调整了一晚

出师不利始康定

2013-07-18 06:00正式开始了我们的川藏线骑行之旅

似乎天空不作美，一出门就看见仙女的眼泪，密密麻麻的滴在地面，也滴在了我们的心里

纵使她万般挽留，我们依旧没有丝毫的动摇，毅然决然的出发了

可人算不如天算，成都到康定的这段318路线因暴雨已经封闭，不让通行

不知道要封闭多久，其他路线又没有详细的攻略，不敢贸然行动

所以我们选择了一种轻松的方式：坐汽车到康定

经过漫长的等待、颠簸，于2013-07-18 22:13，我们到达了康定

下车后，急忙找了一间民宿，那时是真的困，我们很快就进入了梦乡

婴儿般的睡眠，很是怀恋

初尝失算新都桥

2013-07-19清晨，正式开始了我们的骑行之旅

天空些许阴沉，冷风中夹带着细雨，零零散散的行人，时不时的哈气、搓手

此时的我们异常兴奋，直奔着下一站（雅江）急速而去

骑行了17公里之后，我们来到了折多山脚，此时已是上午的09:45，距离折多山垭口还有35公里

心里想的是：哼，才区区35公里，那不是张飞吃豆芽，小菜一碟？

可骑着骑着，我们发现速度并没有比徒步的快，似乎还有被超的迹象！

13:00，此时距离垭口还有13公里，我们的锐气已荡然无存，高反已悄然而至

加上没有准备足够的干粮，我和阿超已明显感觉不适，眼前发黑，停下车，靠着路边的防护栏呕吐起来

阿方见状，在路边的摊贩买了两瓶红牛（一罐貌似是八块！），递给了我跟阿超

喝了红牛之后，我们在路边坐了将近一个小时，状态才基本恢复，顶着饥饿继续前进

17:47我们终于到达折多山垭口

此时天空下起了雨，还伴随着一粒粒的冰雹，放眼望去，哪有栖息之所？

我们只能继续赶路，赶往45公里外的新都桥（至于既定的目的地：雅江，一点想法没有了）

一路下坡，一路狂飙冷冷的冰雨在脸上胡乱的拍，呼呼的狂风在耳边肆意的啸，很快全身湿透，体温急骤下降

全身开始哆嗦，嘴唇逐渐变紫，直至发黑，更让我绝望的是小腿开始抽筋，丝毫不敢用力

望着渐行渐远的两个小伙伴，我甚至连呼喊的力气都没有了，隐隐约约看见死神在逼近

擦干眼睛，定神一看，那不是死神，那是我的两个兄弟！

看着摇摇晃晃的我，他们拼尽最后的力气拦停了我的车，将我从车上艰难的扶下了车

我们用尽最后的力气把车推到了路边的休息区

望着被紧紧绑住的驮包，我们陷入了绝望，尝试了几次，弹力绳纹丝不动

也许是上天怜悯，一辆温馨的小轿车在我们旁边停了下来，从车里下来了一个帅气的大哥

在他的帮助下，我们终于换上了干衣服、干鞋子，而此刻雨也停了

时间已经来到了19:57，天空还剩最后的一丝余亮，距离新都桥还剩9公里，我们继续前行

因为太过饥饿，这9公里显得格外的遥远

当看到路边藏民家的灯的时候，我们决定停下了（此时距离新都桥还剩3公里）

热心的藏民同胞给我们安排了房间，还给我们准备了丰盛的晚餐

吃饱之后，倦意席卷而来，很快我们就进入了梦乡

不幸的是，第二天阿超就感冒了，我们只能休整一天，顺便把湿衣物吹干（吹风机慢慢吹）

一秒入睡在雅江

在新都桥休整好后，我们继续出发，朝着雅江而去

翻越了4412米高的高尔寺山

翻山随难，但不似折多山那般，也没了高反，一切顺利了很多

从山顶顺坡之下，犹如脱缰的野马，飞速疾驰

车轱辘似乎也放肆了起来，隐隐有要单飞的感觉，我时不时的紧一紧刹车

16:00，我们到达雅江，感觉还早，我们继续往前赶路

又骑了一个半小时，困意席卷而来，忌惮于折多山的余威，我们决定停下休息

阿超去点菜的间隙，我和阿方已经进入了梦乡

困，是真的困！

上完菜后，阿超细声的呼唤着我俩：醒醒，吃饭了！

三人狼吞虎咽，将菜一扫而光，所幸饭可以无限续

饿，也是真的饿！

吃饱喝足，进行洗漱整理，伴随着黑夜的降临，上床入梦

一分为二入理塘

早上六点我们就出发了，今天的目标是130公里外的理塘

距离不是很远，但有两座大山，不会那么容易的

经历了前几天的磨砺，我们已经基本适应，虽说速度依旧慢，但身体已没有不适

一路晴空万里，蓝天白云，漫游在山坡上，内心纯粹无比

顺着超扁的S型盘山公路在山坡上蠕动，内心毫无杂念，一心就想着上垭口

终于于15:00到达4659米高的剪子弯山垭口

不敢做过多的逗留，休整片刻后我们继续往前赶路

下坡是所有骑友的最爱，其中也包括我

但依旧不敢完全松开刹车，任由我的“悍马”驰骋，左边时常经过的大卡车，右边深不见底的深渊，时刻告诫着我们不能掉以轻心

伴随着夜幕的降临，我们已经身心俱疲，但依旧没有找到可以落脚的地方

打开前后车灯，继续往前骑，伴随着一阵阵的狼嚎，终于在21:35找到了一处藏民的帐篷

此刻我们饥寒交迫，没有任何赶路的想法了

和藏胞谈妥后，悬着的心终于放下了，围着火炉坐下，感受着暖意的扑面而来

藏胞给我们热了酥油茶，一口下肚，暖流入胃，奶香上鼻

还给我们煮了牛肉面，粒粒牛肉，片片白菜，根根面条，在白汤的滋润下，鲜香无比

吃饱之后困意如期而至，宽大的帐篷下簇拥着好几张床，挑了心仪的一张后安然入睡

第二天清晨，我们看到了高大威猛的藏獒、天真浪漫的小牦牛、任劳任怨的母牦牛，在晨光的照耀下，是那么的静谧与美好

和藏胞进行了短暂的告别后，继续我们的旅途，朝着理塘而去

途中翻越了卡子拉山

从剪子弯山到理塘的路程，整体海拔是下降的，整个路线也是下坡居多

而卡子拉山只是其中少有的上坡的小插曲，上升高度很低，少了翻山的难度，也少了翻过的兴奋

翻过卡子拉山后，阿方的“宝马”开始兴奋起来了，后轮出现了很明显的左右摆动，像是在告诉我们：来吧来吧，一起摇摆！

我和阿超赶紧跟上去，打断了阿方的兴奋，三个人一起下车，推车前行

边走边拦截路过的四个轱辘 ，希望能拦停好心人，将阿方连人带车一起带去理塘

也许是上天刻意的考验，四个轱辘都是从擦身而过，除了带起一片尘烟，什么也没有留下

推了一段距离后，我们决定阿方去最近的158道班（类似一个小驿站）修车和休整，我和阿超先去理塘等阿方

这里说明下：不是我和阿超“抛弃”了阿方，是考虑到158道班很小，而一路上骑行的驴友很多，我们三个人都去的话，可能住不下，另外就是身上的现金已所剩无几，需要去理塘取钱了

阿超（“独揽财政大权”）将身上本不多的现金一大半给了阿方（计划是去理塘取现金的），然后将阿方驮包中的馕、需要清洗的衣服拿了过来

阿方推车朝着158道班而去，我和阿超则骑车奔着理塘而去

在日落前我和阿超赶到了理塘

找了一间旅馆，卸下行囊，把需要清洗的都清洗好之后，我和阿超开始了啃馕

第二天接着啃馕，等着阿方的到来

在16:40，阿方来了，加入了啃馕队伍，晚上三个人一起啃馕，馕好像变香了！

日行百八飞巴塘

经过一晚的休整，三人状态都恢复的不错

理塘至巴塘有将近180km ，早上六点我们踏上了前往巴塘的旅程

出了理塘西城门，就来到了毛垭大草原 ，群山环抱，郁郁葱葱，停车驻足，心旷神怡

路况非常好，视野很开阔，一眼过去，直达天际

花花草草的地下隐藏着很多大家都很熟悉的小可爱，没错，就是它：

大概下午四点，我们登上了海子山垭口，看到了柔美的姊妹湖，湖水碧蓝，恬静而温婉，堪称人间仙境

停下车，快速的奔向姊妹湖，近距离的欣赏、感受着姊妹湖，内心逐渐平静，身心的疲惫也慢慢消散

纵有万般不舍，依旧要往前行

收拾心情，八十千米的下坡，我们来了！

一路下坡，穿过好几个隧道后，终于在晚上九点多来到了巴塘的胖姐休闲庄

我们这一次终究还是来得太迟，错过了床才有的温馨舒适，酝酿好久终放下对床的相思，最后客厅过道成地铺地址（改编自歌曲太迟）

出川入藏至芒康

即将入藏，无比期待，早早的就出发了

沿着巴河南下，很快来到了金沙江

一似渭，一似泾，汇合似渭泾，实属难得的景观
来到金沙江大桥，望着西藏的界碑

想着即将见到魂萦梦绕的她，激动万分

停车回首，感慨颇多

来不及好好告别，空留一段，记忆的线，系不下长长的哀恋 ，却魂绕梦牵，恍惚中又和你相见（摘自歌曲紫）

经过长长的排队，检查了身-份-证，登记了基本信息，我们终于进藏了，梦里的她，我们来了！

经过漫长的缓上坡，于下午七点左右，我们来到了海通兵站，在海通兵站的斜对面找了一个落脚点：扎西德勒藏餐馆

二楼一个大房间内，床挨着床，放置好行李后，发现二楼没有洗手间

来到一楼询问老板娘：你好，请问洗手间在哪？

老板娘：洗手间？

我：厕所在哪？

老板娘向屋后指了一下，然后画了一个圈，好像在说：屋外都行

疑惑的我们来到屋外，向河边走去，突然从河边的深草中站起一个女孩，时不时的整理身上的衣服

我们三个面面相觑，顿时悟了：诺大的露天洗手间，河边、山间都可以大小恭，于是我们在山边的灌木林中解决了排泄问题

晚上躺在床上快入梦乡时，陆陆续续来了很多藏胞走进了隔壁的房间，不一会就响起了嘹亮的歌声；原来隔壁是个KTV！

伴随着他们“优美的歌声”，我们迟迟未能入睡，听又听不懂，说又不敢说，只能强迫着自己尽力去“欣赏”

好不容易入睡了，结果又赶上两大狗帮在街斗，狗吠声很响亮，听着有大几十只

也不知道斗了多久，它们终于散去，至于谁输谁赢，无从知道

那晚，我也不知道睡着了多长时间

要不得说，年轻是真好，第二天依旧六点出发，虽说不是十分兴奋，但没那么疲惫

不知不觉就来到了宗拉山垭口

没有了往日翻山的艰难，似乎也少了翻过之后的兴奋

继续前行，当来到拉乌山垭口的时候，突然乌云密布，豆大的冰雹顷刻间就落下

似乎冥冥中注定一般，正好路边停着一辆大货车，暂时寄居在它的庇护下

高原地区的雨雪，来的突然，去的也突然，不一会又晴空万里了

经过35km的长下坡，我们来到了如美镇，找了一间旅舍，停下了脚步，开始清洗衣物

经过一晚的休整，状态恢复的很不错，但今明两天注定很艰难

险峻莫过觉巴，高寒当属东达 ， 觉巴山是今天要征服的，而东达山是明天要翻越的
来到觉巴山脚，抬头望去，一排又一排的U型盘山公路，脑瓜子嗡嗡的

公路左边是万丈深渊，右边是怪石嶙峋的峭壁，着实险峻

一路盘山而上，一路心惊胆战，到达觉巴山垭口后

迎来了短暂的下坡，在登巴村进行了短暂的休息后，继续前行，赶往荣许兵站 
终于在晚上八点左右达到了荣许兵站 ，找了一家旅舍，吃饱喝足后开始入睡，明天又是一场鏖战

推上最高下左贡

清晨，天空灰蒙蒙，下着小雨，温度很低

没蹬几步，阿方停下了，他的“宝马”左边的脚踏板掉了，气人的是我们装备里面没有大扳手，没法拧紧，真的是：屋漏偏逢连夜雨，船迟又遇打头风

所以我们仨决定，一同推车翻东达

一路推行，我们超越了好几拨骑行的，他们都露出了怀疑的目光

大概下午两点，我们到达东达山垭口，鞋子和裤子已经湿透，但我们内心却火热无比

盘边帐篷是个补给点，但东西是有点贵，拿起的泡面又放下了

稍息片刻，我们骑上车下坡而去，此时寒意更甚于推车

我们在坡边找到了藏胞家，家里只有老奶奶和小孙子，正好有一堆炭火，我们换了袜子和鞋子，烤干了裤子

给他们留了一些糖果后，我们继续赶路，在下午五点左右到达左贡县城

先找地方修了阿方的脚踏，然后找到了邮政银行取了现金，还补充了干粮

吃吃喝喝洗洗后，很快就进入了梦乡

坑坑洼洼颠邦达

左贡至邦达，绝大部分是砂石路、搓板路，很伤车，也很伤人

路面坑坑洼洼，四个轱辘经过，要么溅你一身泥，要么扬你一脸灰

所幸今天不用翻山，但骑行速度不比翻山快

在天黑之前，还是到达了邦达

镇上的旅舍基本都满了，我们最终选择了离镇不远的藏胞家

广场上很多藏獒，并非印象中的威猛霸气

是放养，还是流浪？不得而知

七十二拐拐八宿

清早出发，很快就开始了盘山，爬了两个多小时后，来到半山腰，回头一看，邦达近在咫尺

蓝天白云，群山环绕，河流穿过，还有大草原，辽阔壮美，一览无遗

继续盘山，大概十一点，我们到了业拉山垭口

业拉山垭口有服务中心，自驾的、骑行的、徒步的、朝圣的汇聚于此，或休整、或补给、或拍照、或摄影，热闹非凡

在观景台看到了即将要奔赴的怒江72拐，壮观无比，令人瞠目结舌

也得知了它亦称九十九道拐

心中窃喜的是下72拐，而不是上

下山时，双手要紧紧放在刹车上，时不时捏一下刹车降一下速度，听说这里出过很多事故，所以我们格外谨慎

快乐与危险并存，天堂与地狱一线，痛并快乐着

从垭口到怒江边上，海拔降了近2000米，短短的几个小时，我们就经历了四季，山顶的冬冷，山腰的春（秋）暖（爽），山谷的夏热

停车稍息片刻，补上几口干粮，继续赶往八宿

今天比较顺畅，天气很好，人和车都很稳妥，早早的就到了八宿县上

八宿挺大的，房屋挺多，此刻的气候也很暖和

天不遂愿待然乌

早早的出发，今天的挑战不小

不同于之前的长上坡，也不同于之前的U型盘山公路
70km的反复起伏，总体上坡直至安久拉山垭口，不一样的骑行感受，不一样的骑行困难，就像折多山那次一样，非常难受

但还是坚持了下来，在下午三点左右，我们登上了安久拉山垭口

休息与拍照自是不可少，天气也很给力，蓝天白云，疲惫感逐渐消散，补充些许口粮之后，继续上路

虽说整体是下山，但却是反复起伏着下坡，心中一万只草泥马奔腾而过

当穿过保护性长廊后

我们来到了然乌镇

找了一家离公路较远、离然乌湖较近的藏民家，有洗浴间，有卫生间，非常不错

一路骑来，都未曾停下好好欣赏周边的风景，和小伙伴商量明天在然乌休整一天，去看看来古冰川

第二天睡了个懒觉，起的比较晚，吃过早餐后，我们租了一辆车去看来古冰川

今天不赶路，就是撒欢！

可惜的是来的季节不对，冰川已离去大半，山顶的冰雪依旧清晰可见，山脚则只有零零星星

在这里，我们的车队人数达到了最大

从左往右分别是：少帅、楼猪、阿方、琦哥、阿超、咖啡师、阿胜、阿凯

一天下来就是看、躺、拍、嬉戏打闹，主打就是一个开心

我们回到镇上吃晚饭，畅聊着接下来的行程，要翻的山只剩两座：色季拉山、米拉山，路况也相对会好很多，骑行会顺畅不少

第二天清早，天朗气清，空气清新，我们来到镇上吃早餐

也许是昨天的无限欢乐引起了老天的嫉妒，给我们开了一个巨大的玩笑：昨晚（2013-08-02）11点通麦大桥断了，整座大桥全部坍塌！

我们一开始都不信，阿超和琦哥卸下装备，空骑去核实了，结果属实，但也带回来一丝希望：大桥旁边有一座老桥

老桥宽度不够，只能通行人和自行车，而且年久失修，直接封闭不让通行

我们只能等，期盼着早日把老桥维修好；既然走不了了，那就好好玩乐，当天我们逛了然乌湖

第二天，一拨人打了一天的升级（扑克的一种玩法），一拨人出去逛了周边

第三天早上，我们来到镇上，打听到老桥还是没有通行，但时间容不得我们继续等下去了（大家都是参加工作，或者是即将参加工作的人）

我们商量决定租车去昌都，然后通过北线到拉萨（咖啡师时间比较充足，他决定留下来继续等）

我们正式开始了四轮之旅！

一路惊魂终拉萨

不得不说，坐车确实舒服不少，就是什么都看不到，丢失了这次旅途的初衷
从然乌逆向而行，北上经八宿至昌都市

相对而言，昌都要繁华不少，但我们来的比较晚，坐车从南线来昌都的骑友也很多，加上本身就走北线的人

旅店都已经住满，最后派出所收留了我们（不是我们犯了事，实在是没有睡觉的地方了！）
从昌都至拉萨，具体歇息了几站，不记得了，依稀记得睡过网吧，睡过旅馆等等

昌都之后，司机每天都是重度疲劳驾驶，行驶在悬崖边的公路上，我们提心吊胆，阿超和阿胜轮流盯着司机

给司机按摩、喂红牛，一旦司机打盹就拍醒他，时不时放那些激情澎湃的歌曲给司机提神

而我们其他人，貌似没意识到问题的严重性，一个个睡的老香了！

北线的路况比南线要差很多，但风景同样很优美

于2013-08-09早上到达了拉萨

兜兜转转游拉萨

刚进拉萨，一个帅哥开着小车来到了我们旁边，盯着我跟阿方的车，表现出了很浓厚的兴趣

问我们车卖不卖，他的两个小孩一直想要一辆

正好我跟阿方想把车出掉，就问到他能出多少钱

帅哥试了一下我的车，觉得还不错，就说500行不行

然后同伴们就一起吹嘘这两辆车有多好，最后550一辆成交

帅哥开开心心买下了车，放进了后备箱，我和阿方高高兴兴收下了钱，坐上同伴的车快速离去

找了一家岳阳老乡的宾馆，接下来的几天就以此处为大本营了

当天没有出去逛，而是清洗、整理衣物，晚上去网吧打了几把LOL、上传照片

2013-08-10我们开始了逛拉萨，西藏博物馆、清政府驻藏大臣衙门、西藏大学、布达拉宫广场、大昭寺、色拉寺

2013-08-11凌晨2点，琦哥、少帅、阿胜、阿凯排队买票，参观了布达拉宫

我、阿超、阿方觉得太累，就在宾馆休息了

等他们从布达拉宫回来，我们一并去了八廓街，吃当地特色美食，买当地特色纪念品，逛逛买买，甚是悠闲

当我们返程时，发现停在派出所门口的山地车被偷了两辆，琦哥和阿胜的车被偷了

小偷是懂车的，琦哥的车5000多，阿胜的车3000多，是我们队伍中最好的两辆车

要知道，这可是2013年！
去派出所请求帮助，说没看没开，也没看到是谁偷走的，无疾而终

很不愉快的回到宾馆，第二天决定去二手车市场碰碰运气

2013-08-12一早，我们一起去了二手车市场，一路看下来，并没有发现琦哥和阿胜的车，最后的希望也落空了

下午，我们仨去踩点了拉萨火车站，方便明天的归程

三天归程脚浮肿

2013-08-13，我们仨和其他小伙伴正式道别，没有依依不舍，分别的很洒脱

阿超的车通过邮寄运回了湖南，上车前买了2斤脆皮蛋糕，一共30元，买了12桶泡面，这些是接下来三天两夜的食物

我们买的是Z266次列车，绿皮的硬座，始于拉萨，途经那曲、格尔木、德令哈、西宁、兰州、咸阳、西安、郑州、武昌，最后到达长沙

一共要花47小时39分钟，但因为晚点了一个多小时，我们一共坐了49个小时

青海湖非常漂亮，湖边很多飞禽走兽，碧蓝的天空映射在湖面，煞是美丽，此刻只想吟诗一首：落霞与孤鹜齐飞，秋水共长天一色

从拉萨（海拔3660多）到西安（海拔400多），海拔降的很快，车上很多人出现了严重的耳鸣，幸亏火车上有随行的医护人员提供帮助

我们仨也出现了轻微的耳鸣

在西安进行了换车，阿超用仅剩的钱买了三个肉夹馍，肉没有，夹了不少盐，这不讲武德的商贩欺人太甚！

终于在2013-08-15下午一点多，我们到达了长沙

当我准备起身时，发现起不来，低头一看，整个脚背全水肿了，转向他俩一看，一样的情况，估计是坐太久没动的原因导致

轻柔一下脚背，稍微运动一下脚，慢慢的可以起身动起来了

从2013-07-16到2013-08-15，整整一个月（是巧合，还是计划好的？），我们的旅程正式结束！

相关补充

资金

我们这次出行，家里父母是都不知道的，我们也没向家里要钱

通过大学期间的捣鼓：家教、售卖二手电脑、其他兼职等，我们存下了这次旅行的费用

最初人均预算是4000多，最后超出了预算一丢丢，在可以接受的范围之内

其实是可以拉赞助的，途中我们就遇到了很多拉着捷安特、美利达等等横幅的骑友，据说赞助费不菲

火车票

从拉萨到长沙的火车票，需要提前15天预订
骑行途中通过另外一个好朋友帮忙买的，买了之后退的话，怕再次买不到了

这也是我们不能在然乌一直等的原因

照片画质

相信很多小伙伴已经看出了上文中的很多照片，画质喜感

没办法，绝大部分照片使用直板手机拍的，那时候智能机还没普及，手机拍照功能很拉胯

少数几张高画质的是从其他同行小伙伴用单反拍的，大家将就着看吧

感悟

车很重要、车很重要、车很重要，但不是最重要的，最重要的还是发动机（人的意志）、发动机、发动机

祖国很大，广袤的大好河山足够我们欣赏一辈子，国外的月亮不比国内的圆

这趟旅程很是历练，如果时间充裕，强烈建议时常停车驻足，用心去感受这纯天然、无污染的自然景观

有空多出去走走，逛逛，看看，给嘈杂的内心寻找片刻安静的港湾，对调整个人心情甚有帮助

十年前的这次旅行，经历了很多挑战、困难，感受了很多惊喜、刺激，留下了太多不舍、遗憾

最近，再骑一次的声音一直萦绕耳畔，内心的冲动也是愈发强烈，但此时非彼时，有生之年能否再骑一次？

前言

众所周知，Region是android graphics一族中比较低调的工具类，主要原因还是在碰撞检测方面存在一些不足，甚至可以说成事不足败事有余，以至于难以用于2D游戏开发，这也是耽误你们成为2D游戏大师路上的一道坎 。既然Region这么失败的工具为什么要介绍呢，一方面本篇通过路径检测的方式解决了成事不足败事有余的问题，另外一方面我们也要介绍他可用的部分，以及正确的用法。最后，本篇其实主要是通过PathMeasure和Region相互配合，优化了碰撞检测逻辑精确度问题。

预览效果

这是我们最终要达到的效果。

异常效果

我们需要重点处理两个问题

• 没接触到就检测到碰撞


• 接触已经很多距离了才检测到碰撞

Region 碰撞检测问题

• Region类能成事的部份主要还是Op布尔操作和矩阵操作，但是这个似乎又和Path的作用重合，不知道是不是因为性能更高呢？本文没有去测试，有机会测试一下。另外一部分containXXX包含关系判断，containXXX能准确的判断点和矩形是不是被包含了，但是其他形状那就没办法了。


• quickXXX 快速检测方法，返回值true-能确保物体没有碰撞，但false无法确保是不是已经碰撞了，换句话说true是100%没碰撞，但是false还需要你自己进一步确认，不过这点可以作为减少判断的优化方法，但不是判定方法。

学习Region & PathMeasure 的意义

对于一些粒子，我们不太关注大小，这个时候是可以利用中心点去检测的，那对于多边形或者半圆等形状，点是非常多的，显然得找一种更好的方法。实际上看似quickXXX其实用处不大，其实可以减少一部分检测逻辑，quickXXX虽然比不上contains的精确度，但是仍然能检测到没有碰撞，本篇需要了解它的用法，然后配合PathMeasure，实现精确检测。

非Path用法

对于非Path用法，Region还是相当简单的，直接使用set方法即可

mainRegion.set((int) -radius, (int) -radius, (int) radius, (int) radius);

Path方法

这个用法比较奇怪，需要2个参数，最后一个是Region类，弄不好就是鸡生蛋蛋生鸡一样令人迷惑，第二个可以看作被裁剪的区域，如下操作，求并集区域。不过话说回来，这个意义在哪里？

circlePath.reset();

circlePath.addCircle(x- width/2f,y - height/2f,10, Path.Direction.CCW);

circleRegion.setPath(circlePath,mainRegion);

小试一下

实现开头的图片效果，定义一些Path和形状。

定义一些变量

 private float x; //x事件坐标

 private float y; //y事件坐标



 //所以形状

 Path[] objectPaths = new Path[5];

 //形状区域检测

 Region objectRegion = new Region();

 

 //小圆球区域

 Region circleRegion = new Region();

//小圆

 Path circlePath = new Path();

 //绘制区域

 Region mainRegion = new Region();

构建物体

三角形、圆等物体

for (int i = 0; i < objectPaths.length; i++) {

    Path path = objectPaths[i];

    if (path == null) {

        path = new Path();

        objectPaths[i] = path;

    } else {

        path.reset();

    }

}



Path path = objectPaths[0];

path.moveTo(radius / 2, -radius / 2);

path.lineTo(0, -radius);

path.lineTo(radius / 2, -radius);

path.close();



path = objectPaths[1];

path.moveTo(-radius / 2, radius / 2);

path.lineTo(-radius / 2 - 100, radius / 2);

path.arcTo(-radius / 2 - 100, radius / 2, -radius / 2, radius / 2 + 100, 0, 180, false);

path.lineTo(-radius / 2, radius / 2);

path.close();



path = objectPaths[2];

path.addCircle(-radius + 200f, -radius + 100f, 50f, Path.Direction.CCW);



path = objectPaths[3];

path.addRoundRect(-radius / 2, -radius / 2, -radius / 2 + 20, 0, 10, 10, Path.Direction.CCW);



path = objectPaths[4];

path.addRect(120, 120, 200, 200, Path.Direction.CCW);

区域检测

检测是否发生了碰撞，准确度不高，但还能凑合

circlePath.reset();

circlePath.addCircle(x- width/2f,y - height/2f,10, Path.Direction.CCW);

circleRegion.setPath(circlePath,mainRegion);



mCommonPaint.setColor(Color.CYAN);

for (int i = 0; i < objectPaths.length; i++) {

    objectRegion.setPath(objectPaths[i],mainRegion);

    if(!objectRegion.quickReject(circleRegion)){

        Log.d("RegionView"," 可能发生了碰撞");

        mCommonPaint.setColor(Color.YELLOW);

    }else{

        mCommonPaint.setColor(Color.CYAN);

    }

    canvas.drawPath(objectPaths[i], mCommonPaint);

}

到这里我们完成了简单的检测，但其实它的精确度很差，这个效果显然不是我们想要的，尤其没有实际接触的情况就染色了。这样会产生很多争议，比如游戏中刘备不可能超出攻击范围去打你一样。

精准区域检测优化

在我们做推箱子游戏和珠珠碰撞的时候，我们都是用圆心之间的距离去检测，显然这里是不行的，不光障碍物本身有形状且不规则，而且中心区域正中可能是空白区域，显然圆心之间的距离是不合适的。我们之前学过PathMeasure很多用法《心跳效果》，其中之一是使用粒子描线，下图是我们的效果，在这篇中我们利用PathMeasure对获取路径坐标，并对线周围布置粒子。

那么，使用PathMeasure方式获取线条边缘的点不就更准确了么 ？好的，我们开干。

优化逻辑

• 获取障碍物和圆的Bounds，计算面积，这样把检测物体和被检测物体中最小的设置给PathMeasure


• 利用PathMeasure的getPosTan获取点


• 使用Region的contain进行判断点是不是在区域内

下面是优化逻辑

circlePath.reset();

circlePath.addCircle(x- width/2f,y - height/2f,20, Path.Direction.CCW);

circleRegion.setPath(circlePath,mainRegion);





mCommonPaint.setColor(Color.CYAN);

for (int i = 0; i < objectPaths.length; i++) {

    objectRegion.setPath(objectPaths[i],mainRegion);

    if(!objectRegion.quickReject(circleRegion)){

        mCommonPaint.setColor(Color.YELLOW);

        if (circleRegion.getBounds(circleRect)

                && objectRegion.getBounds(objectRect)) {



            Region regionChecker = null;

            if (circleRect.width() * circleRect.height() > objectRect.width() * objectRect.height()) {

                pathMeasure.setPath(objectPaths[i], false);

                regionChecker = circleRegion;

            } else {

                pathMeasure.setPath(circlePath, false);

                regionChecker = objectRegion;

            }



            for (int len = 0; len < pathMeasure.getLength(); len++) {

                pathMeasure.getPosTan(len, pos, tan);

                if(regionChecker.contains((int) pos[0], (int) pos[1])){

                    Log.d("RegionView"," 可能发生了碰撞");

                    mCommonPaint.setColor(Color.YELLOW);

                }

            }



        }



    }else{

        mCommonPaint.setColor(Color.CYAN);

    }

    canvas.drawPath(objectPaths[i], mCommonPaint);

}

我们再来看效果，就是文章开头的效果

总结

到这里结束了，对于Region类，对点的检测是非常精准的，但是在数学中，所有图形都是点构成线、线构成面，我们本篇利用PathMeasure和Region配合实现了精准检测逻辑，扫平了2D游戏开发过程中的一道门槛。希望看过本篇之后，你能成为游戏大师。

全部代码

有个小插曲，演示精确度低的时候导致代码被还原了，所以重新画了一些东西。

public class RegionView extends View {

    private final DisplayMetrics mDM;

    private TextPaint mCommonPaint;



    public RegionView(Context context) {

        this(context, null);

    }



    public RegionView(Context context, AttributeSet attrs) {

        super(context, attrs);

        mDM = getResources().getDisplayMetrics();

        initPaint();

        setClickable(true); //触发hotspot

    }



    private void initPaint() {

        //否则提供给外部纹理绘制

        mCommonPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);

        mCommonPaint.setAntiAlias(true);

        mCommonPaint.setStyle(Paint.Style.FILL);

        mCommonPaint.setStrokeCap(Paint.Cap.ROUND);

        mCommonPaint.setFilterBitmap(true);

        mCommonPaint.setDither(true);

        mCommonPaint.setStrokeWidth(dp2px(20));



    }



    @Override

    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        int widthMode = MeasureSpec.getMode(widthMeasureSpec);

        int widthSize = MeasureSpec.getSize(widthMeasureSpec);

        if (widthMode != MeasureSpec.EXACTLY) {

            widthSize = mDM.widthPixels / 2;

        }

        int heightMode = MeasureSpec.getMode(heightMeasureSpec);

        int heightSize = MeasureSpec.getSize(heightMeasureSpec);



        if (heightMode != MeasureSpec.EXACTLY) {

            heightSize = widthSize / 2;

        }

        setMeasuredDimension(widthSize, heightSize);



    }



    private float x;

    private float y;



    //所以形状

    Path[] objectPaths = new Path[7];

    //形状区域检测

    Region objectRegion = new Region();



    //小圆球区域

    Region circleRegion = new Region();

    //小圆

    Path circlePath = new Path();

    //绘制区域

    Region mainRegion = new Region();



    Rect circleRect = new Rect();

    Rect objectRect = new Rect();



    float[] pos = new float[2];

    float[] tan = new float[2];



    PathMeasure pathMeasure = new PathMeasure();



    @Override

    protected void onDraw(Canvas canvas) {

        super.onDraw(canvas);

        int width = getWidth();

        int height = getHeight();

        if (width < 1 || height < 1) {

            return;

        }



        int save = canvas.save();

        canvas.translate(width / 2f, height / 2f);

        float radius = Math.min(width / 2f, height / 2f);



        mainRegion.set((int) -radius, (int) -radius, (int) radius, (int) radius);



        for (int i = 0; i < objectPaths.length; i++) {

            Path path = objectPaths[i];

            if (path == null) {

                path = new Path();

                objectPaths[i] = path;

            } else {

                path.reset();

            }

        }



        Path path = objectPaths[0];

        path.moveTo(radius / 2, -radius / 2);

        path.lineTo(0, -radius);

        path.lineTo(radius / 2, -radius);

        path.close();



        path = objectPaths[1];

        path.moveTo(-radius / 2, radius / 2);

        path.lineTo(-radius / 2 - 100, radius / 2);

        path.arcTo(-radius / 2 - 100, radius / 2, -radius / 2, radius / 2 + 100, 0, 180, false);

        path.lineTo(-radius / 2, radius / 2);

        path.close();



        path = objectPaths[2];

        path.addCircle(-radius + 200f, -radius + 200f, 50f, Path.Direction.CCW);



        path = objectPaths[3];

        path.addRoundRect(-radius + 50, -radius / 2, -radius  + 90, 0, 10, 10, Path.Direction.CCW);



        path = objectPaths[4];

        path.addRect(120, 120, 200, 200, Path.Direction.CCW);



        path = objectPaths[5];

        path.addCircle(250, 0, 100, Path.Direction.CCW);



        Path tmp = new Path();

        tmp.addCircle(250,-80,80,Path.Direction.CCW);

        path.op(tmp, Path.Op.DIFFERENCE);



        tmp.reset();

        path = objectPaths[6];

        path.addCircle(0, 0, 100, Path.Direction.CCW);

        tmp.addCircle(0, 0, 80, Path.Direction.CCW);

        path.op(tmp, Path.Op.DIFFERENCE);





        circlePath.reset();

        circlePath.addCircle(x- width/2f,y - height/2f,20, Path.Direction.CCW);

        circleRegion.setPath(circlePath,mainRegion);





        mCommonPaint.setColor(Color.CYAN);

        for (int i = 0; i < objectPaths.length; i++) {

            objectRegion.setPath(objectPaths[i],mainRegion);

            if(!objectRegion.quickReject(circleRegion)){

                if (circleRegion.getBounds(circleRect)

                        && objectRegion.getBounds(objectRect)) {



                    Region regionChecker = null;

                    if (circleRect.width() * circleRect.height() > objectRect.width() * objectRect.height()) {

                        pathMeasure.setPath(objectPaths[i], false);

                        regionChecker = circleRegion;

                    } else {

                        pathMeasure.setPath(circlePath, false);

                        regionChecker = objectRegion;

                    }



                    for (int len = 0; len < pathMeasure.getLength(); len++) {

                        pathMeasure.getPosTan(len, pos, tan);

                        if(regionChecker.contains((int) pos[0], (int) pos[1])){

                            Log.d("RegionView"," 可能发生了碰撞");

                            mCommonPaint.setColor(Color.YELLOW);

                        }

                    }



                }



            }else{

                mCommonPaint.setColor(Color.CYAN);

            }

            canvas.drawPath(objectPaths[i], mCommonPaint);

        }



        mCommonPaint.setColor(Color.WHITE);

        canvas.drawPath(circlePath,mCommonPaint);

        canvas.restoreToCount(save);

    }



    @Override

    public void dispatchDrawableHotspotChanged(float x, float y) {

        super.dispatchDrawableHotspotChanged(x, y);

        this.x = x;

        this.y = y;

        postInvalidate();

    }



    @Override

    protected void dispatchSetPressed(boolean pressed) {

        super.dispatchSetPressed(pressed);

        postInvalidate();

    }



    public float dp2px(float dp) {

        return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, mDM);

    }



    public static int argb(float red, float green, float blue) {

        return ((int) (1 * 255.0f + 0.5f) << 24) |

                ((int) (red * 255.0f + 0.5f) << 16) |

                ((int) (green * 255.0f + 0.5f) << 8) |

                (int) (blue * 255.0f + 0.5f);

    }





}

Android原生ProgressBar

原生ProgressBar样式比较固定，主要是圆形和线条；也可以通过style来设置样式。

style：

原生的特点就是单调，实现基本的功能，使用简单样式不复杂；要满足我们期望的效果就只能自定义View了。

自定义ProgressBar

自定义View的实现方式有很多种，继承已有的View，如ImageView，ProgressBar等等；也可以直接继承自View，在onDraw中绘制需要的效果。
要实现的效果是一个横向圆角矩形进度条，内容为渐变色。
所以在设计时要考虑到可以定义的属性：渐变色、进度等。

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <declare-styleable name="progress">

        <attr name="progress" format="float" />

        <attr name="startColor" format="color" />

        <attr name="endColor" format="color" />

    </declare-styleable>

</resources>

View实现

这里直接继承子View，读取属性，在onDraw中绘制进度条。实现思路是通过定义Path来绘制裁切范围，确定绘制内容；再实现线性渐变LinearGradient来填充进度条。然后监听手势动作onTouchEvent，动态绘制长度。

同时开放公共方法，可以动态设置进度颜色，监听进度回调，根据需求实现即可。

package com.cs.app.view



/**

 *

 */

import android.content.Context

import android.graphics.Canvas

import android.graphics.Color

import android.graphics.LinearGradient

import android.graphics.Paint

import android.graphics.Path

import android.graphics.RectF

import android.graphics.Shader

import android.util.AttributeSet

import android.view.View

import com.cs.app.R



class CustomProgressView(context: Context, attrs: AttributeSet?) : View(context, attrs) {

    private val progressPaint = Paint()

    private val backgroundPaint = Paint()

    private var progress = 50f

    private var startColor = Color.parseColor("#4C87B7")

    private var endColor = Color.parseColor("#A3D5FE")

    private var x = 0f

    private var progressCallback: ProgressChange? = null



    init {

        // 初始化进度条画笔

        progressPaint.isAntiAlias = true

        progressPaint.style = Paint.Style.FILL



        // 初始化背景画笔

        backgroundPaint.isAntiAlias = true

        backgroundPaint.style = Paint.Style.FILL

        backgroundPaint.color = Color.GRAY



        if (attrs != null) {

            val typedArray = context.obtainStyledAttributes(attrs, R.styleable.progress)

            startColor = typedArray.getColor(R.styleable.progress_startColor, startColor)

            endColor = typedArray.getColor(R.styleable.progress_endColor, endColor)

            progress = typedArray.getFloat(R.styleable.progress_progress, progress)

            typedArray.recycle()

        }

    }



    override fun onDraw(canvas: Canvas) {

        super.onDraw(canvas)



        val width = width.toFloat()

        val height = height.toFloat()



        //绘制Path，限定Canvas边框

        val path = Path()

        path.addRoundRect(0f, 0f, width, height, height / 2, height / 2, Path.Direction.CW)

        canvas.clipPath(path)



        //绘制进度条

        val progressRect = RectF(0f, 0f, width * progress / 100f, height)

        val colors = intArrayOf(startColor, endColor)

        val shader = LinearGradient(0f, 0f, width * progress / 100f, height, colors, null, Shader.TileMode.CLAMP)

        progressPaint.shader = shader

        canvas.drawRect(progressRect, progressPaint)

    }



    override fun onTouchEvent(event: android.view.MotionEvent): Boolean {

        when (event.action) {

            android.view.MotionEvent.ACTION_DOWN -> {

                x = event.rawX

                

                //实现点击调整进度

                progress = (event.rawX - left) / width * 100

                progressCallback?.onProgressChange(progress)

                invalidate()

            }



            android.view.MotionEvent.ACTION_MOVE -> {

                //实现滑动调整进度

                progress = (event.rawX - left) / width * 100

                progress = if (progress < 0) 0f else if (progress > 100) 100f else progress

                progressCallback?.onProgressChange(progress)

                invalidate()

            }



            else -> {}

        }

        return true

    }



    fun setProgress(progress: Float) {

        this.progress = progress

        invalidate()

    }



    fun setOnProgressChangeListener(callback: ProgressChange) {

        progressCallback = callback

    }



    interface ProgressChange {

        fun onProgressChange(progress: Float)

    }

}

示例

class CustomViewActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        setContentView(R.layout.activity_custom_view)

        val progressTv: TextView = findViewById(R.id.progress_textview)

        val view: CustomProgressView = findViewById(R.id.progress)

        view.setProgress(50f)



        view.setOnProgressChangeListener(object : CustomProgressView.ProgressChange {

            override fun onProgressChange(progress: Float) {

                progressTv.text = "${progress.toInt()}%"

            }

        })

    }

}

<?xml version="1.0" encoding="utf-8"?>

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto"

    android:layout_width="match_parent"

    android:background="#0E1D3C"

    android:layout_height="match_parent">



    <com.cs.app.view.CustomProgressView

        android:id="@+id/progress"

        android:layout_width="200dp"

        android:layout_height="45dp"

        app:endColor="#A3D5FE"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent"

        app:layout_constraintVertical_bias="0.274"

        app:progress="60"

        app:startColor="#4C87B7" />



    <TextView

        android:id="@+id/progress_textview"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_marginTop="100dp"

        android:textColor="#ffffff"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toBottomOf="@+id/progress" />

</androidx.constraintlayout.widget.ConstraintLayout>

效果如下：

分享一下，最近使用 React 封装的一个 Skus 组件，主要用于处理商品的sku在受到库存的影响下，sku项的选中和禁用问题；

需求分析

需要展示商品各规格下的sku信息，以及根据该sku的库存是否为空，判断是否禁用该sku的选择。

以下讲解将按照我的 Skus组件 来，我这里放上我组件库中的线上 demo 和码上掘金的一个 demo 供大家体验；由于码上掘金导入不了组件库，我就上传了一份开发组件前的一份类似的代码，功能和代码思路是差不多的，大家也可以自己尝试写一下，可能你的思路会更优；

线上 Demo 地址

码上掘金

传入的sku数据结构

需要传入的商品的sku数据类型大致如下：

type SkusProps = { 

  /** 传入的skus数据列表 */

  data: SkusItem[]

  // ... 其他的props

}



type SkusItem = {

  /** 库存 */

  stock?: number;

  /** 该sku下的所有参数 */

  params: SkusItemParam[];

};



type SkusItemParam = {

  name: string;

  value: string;

}

转化成需要的数据类型：

type SkuStateItem = {

  value: string;

  /** 与该sku搭配时，该禁用的sku组合 */

  disabledSkus: string[][];

}[];

生成数据

定义 sku 分类

首先假装请求接口，造一些假数据出来，我这里自定义了最多 6^6 = 46656 种 sku。

下面的是自定义的一些数据:

const skuData: Record<string, string[]> = {

  '颜色': ['红','绿','蓝','黑','白','黄'],

  '大小': ['S','M','L','XL','XXL','MAX'],

  '款式': ['圆领','V领','条纹','渐变','轻薄','休闲'],

  '面料': ['纯棉','涤纶','丝绸','蚕丝','麻','鹅绒'],

  '群体': ['男','女','中性','童装','老年','青少年'],

  '价位': ['<30','<50','<100','<300','<800','<1500'],

}

const skuNames = Object.keys(skuData)

页面初始化

• checkValArr: 需要展示的sku分类是哪些；


• skusList: 接口获取的skus数据；


• noStockSkus: 库存为零对应的skus（方便查看）。

export default () => {

  // 这个是选中项对应的sku类型分别是哪几个。

  const [checkValArr, setCheckValArr] = useState<number[]>([4, 5, 2, 3, 0, 0]);

  // 接口请求到的skus数据

  const [skusList, setSkusList] = useState<SkusItem[]>([]);

  // 库存为零对应的sku数组

  const [noStockSkus, setNoStockSkus] = useState<string[][]>([])



  useEffect(() => {

    const checkValTrueArr = checkValArr.filter(Boolean)

    const _noStockSkus: string[][] = [[]]

    const list = getSkusData(checkValTrueArr, _noStockSkus)

    setSkusList(list)

    setNoStockSkus([..._noStockSkus])

  }, [checkValArr])

  

  // ....



  return <>...</>

}

根据上方的初始化sku数据，生成一一对应的sku，并随机生成对应sku的库存。

getSkusData 函数讲解

先看总数（total）为当前需要的各sku分类的乘积；比如这里就是上面传入的 checkValArr 数组 [4,5,2,3] 共 120种sku选择。对应的就是 skuData 中的 [颜色前四项，大小前五项，款式前两项，面料前三项] 即下图的展示。

遍历 120 次，每次生成一个sku，并随机生成库存数量，40%的概率库存为0；然后遍历 skuNames 然后找到当前对应的sku分类即 [颜色，大小，款式，面料] 4项；

接下来就是较为关键的如何根据 sku的分类顺序 生成对应的 120个相应的sku。

请看下面代码中注释为 LHH-1 的地方，该 value 的获取是通过 indexArr 数组取出来的。可以看到上面 indexArr 数组的初始值为 [0,0,0,0] 4个零的索引，分别对应 4 个sku的分类；

• 第一次遍历:

indexArr: [0,0,0,0] -> skuName.forEach -> 红，S，圆领，纯棉

看LHH-2标记处: 索引+1 -> indexArr: [0,0,0,1];

• 第二次遍历:

indexArr: [0,0,0,1] -> skuName.forEach -> 红，S，圆领，涤纶

看LHH-2标记处: 索引+1 -> indexArr: [0,0,0,2];

• 第三次遍历:

indexArr: [0,0,0,2] -> skuName.forEach -> 红，S，圆领，丝绸

看LHH-2标记处: 由于已经到达该分类下的最后一个，所以前一个索引加一，后一个重新置为0 -> indexArr: [0,0,1,0];

• 第四次遍历:

indexArr: [0,0,1,0] -> skuName.forEach -> 红，S，V领，纯棉

看LHH-2标记处: 索引+1 -> indexArr: [0,0,1,1];

• 接下来的一百多次遍历跟上面的遍历同理

function getSkusData(skuCategorys: number[], noStockSkus?: string[][]) {

  // 最终生成的skus数据；

  const skusList: SkusItem[] = []

  // 对应 skuState 中各 sku ，主要用于下面遍历时，对 product 中 skus 的索引操作

  const indexArr = Array.from({length: skuCategorys.length}, () => 0);

  // 需要遍历的总次数

  const total = skuCategorys.reduce((pre, cur) => pre * (cur || 1), 1)

  for(let i = 1; i <= total; i++) {

    const sku: SkusItem = {

      // 库存：60%的几率为0-50，40%几率为0

      stock: Math.floor(Math.random() * 10) >= 4 ? Math.floor(Math.random() * 50) : 0,

      params: [],

    }

    // 生成每个 sku 对应的 params 

    let skuI = 0;

    skuNames.forEach((name, j) => {

      if(skuCategorys[j]) {

        // 注意：LHH-1

        const value = skuData[name][indexArr[skuI]]

        sku.params.push({

          name,

          value,

        })

        skuI++;

      }

    })

    skusList.push(sku)



    // 注意: LHH-2

    indexArr[indexArr.length - 1]++;

    for(let j = indexArr.length - 1; j >= 0; j--) {

      if(indexArr[j] >= skuCategorys[j] && j !== 0) {

        indexArr[j - 1]++

        indexArr[j] = 0

      }

    }



    if(noStockSkus) {

      if(!sku.stock) {

        noStockSkus.at(-1)?.push(sku.params.map(p => p.value).join(' / '))

      }

      if(indexArr[0] === noStockSkus.length && noStockSkus.length < skuCategorys[0]) {

        noStockSkus.push([])

      }

    }

  }

  return skusList

}

Skus 组件的核心部分的实现

初始化数据

需要将上面生成的数据转化为以下结构：

type SkuStateItem = {

  value: string;

  /** 与该sku搭配时，该禁用的sku组合 */

  disabledSkus: string[][];

}[];



export default function Skus() {

  // 转化成遍历判断用的数据类型

  const [skuState, setSkuState] = useState<Record<string, SkuStateItem>>({});

  // 当前选中的sku值

  const [checkSkus, setCheckSkus] = useState<Record<string, string>>({});

  

  // ...

}

将初始sku数据生成目标结构

根据 data （即上面的假数据）生成该数据结构。

第一次遍历是对skus第一项进行的，会生成如下结构：

const _skuState = {

  '颜色': [{value: '红', disabledSkus: []}],

  '大小': [{value: 'S', disabledSkus: []}],

  '款式': [{value: '圆领', disabledSkus: []}],

  '面料': [{value: '纯棉', disabledSkus: []}],

}

第二次遍历则会完整遍历剩下的skus数据，并往该对象中填充完整。

export default function Skus() {

  // ...

  useEffect(() => {

    if(!data?.length) return

    // 第一次对skus第一项的遍历

    const _checkSkus: Record<string, string> = {}

    const _skuState = data[0].params.reduce((pre, cur) => {

      pre[cur.name] = [{value: cur.value, disabledSkus: []}]

      _checkSkus[cur.name] = ''

      return pre

    }, {} as Record<string, SkuStateItem>)

    setCheckSkus(_checkSkus)



    // 第二次遍历

    data.slice(1).forEach(item => {

      const skuParams = item.params

      skuParams.forEach((p, i) => {

        // 当前 params 不在 _skuState 中

        if(!_skuState[p.name]?.find(params => params.value === p.value)) {

          _skuState[p.name].push({value: p.value, disabledSkus: []})

        }

      })

    })

    

    // ...接下面

  }, [data])

}

第三次遍历主要用于为每个 sku的可点击项 生成一个对应的禁用sku数组 disabledSkus ，只要当前选择的sku项，满足该数组中的任一项，该sku选项就会被禁用。之所以保存这样的一个二维数组，是为了方便后面点击时的条件判断（有点空间换时间的概念）。

遍历 data 当库存小于等于0时，将当前的sku的所有参数传入 disabledSkus 中。

例：第一项 sku（红，S，圆领，纯棉）库存假设为0，则该选项会被添加到 disabledSkus 数组中，那么该sku选择时，勾选前三个后，第四个 纯棉 的勾选会被禁用。

export default function Skus() {

  // ...

  useEffect(() => {

    // ... 接上面

    // 第三次遍历

    data.forEach(sku => {

      // 遍历获取库存需要禁用的sku

      const stock = sku.stock!

      // stockLimitValue 是一个传参 代表库存的限制值，默认为0

      // isStockGreaterThan 是一个传参，用来判断限制值是大于还是小于，默认为false

      if(

        typeof stock === 'number' && 

        isStockGreaterThan ? stock >= stockLimitValue : stock <= stockLimitValue

      ) {

        const curSkuArr = sku.params.map(p => p.value)

        for(const name in _skuState) {

          const curSkuItem = _skuState[name].find(v => curSkuArr.includes(v.value))

          curSkuItem?.disabledSkus?.push(

            sku.params.reduce((pre, p) => {

              if(p.name !== name) {

                pre.push(p.value)

              }

              return pre

            }, [] as string[])

          )

        }

      }

    })



    setSkuState(_skuState)

  }, [data])

}

遍历渲染 skus 列表

根据上面的 skuState，生成用于渲染的列表，渲染列表的类型如下：

type RenderSkuItem = {

  name: string;

  values: RenderSkuItemValue[];

}

type RenderSkuItemValue = {

  /** sku的值 */

  value: string;

  /** 选中状态 */

  isChecked: boolean

  /** 禁用状态 */

  disabled: boolean;

}



export default function Skus() {

  // ...

  /** 用于渲染的列表 */

  const list: RenderSkuItem[] = []

  for(const name in skuState) {

    list.push({

      name,

      values: skuState[name].map(sku => {

        const isChecked = sku.value === checkSkus[name]

        const disabled = isChecked ? false : isSkuDisable(name, sku)

        return { value: sku.value, disabled, isChecked }

      })

    })

  }

  // ...

}

html css 大家都会，以下就简单展示了。最外层遍历sku的分类，第二次遍历遍历每个sku分类下的名称，第二次遍历的 item（类型为：RenderSkuItemValue），里面会有sku的值，选中状态和禁用状态的属性。

export default function Skus() {

  // ...

  return list?.map((p) => (

    <div key={p.name}>

      {/* 例：颜色、大小、款式、面料 */}

      <div>{p.name}</div>

      <div>

        {p.values.map((sku) => (

          <div 

            key={p.name + sku.value} 

            onClick={() => selectSkus(p.name, sku)}

          >

            {/* classBem 是用来判断当前状态，增加类名的一个方法而已 */}

            <span className={classBem(`sku`, {active: sku.isChecked, disabled: sku.disabled})}>

              {/* 例：红、绿、蓝、黑 */}

              {sku.value} 

            </span>

          </div>

        ))}

      </div>

    </div>

  ))

}

selectSkus 点击选择 sku

通过 checkSkus 设置 sku 对应分类下的 sku 选中项，同时触发 onChange 给父组件传递一些信息出去。

const selectSkus = (skuName: string, {value, disabled, isChecked}: RenderSkuItemValue) => {

  const _checkSkus = {...checkSkus}

  _checkSkus[skuName] = isChecked ? '' : value;

  const curSkuItem = getCurSkuItem(_checkSkus)

  // 该方法主要是 sku 组件点击后触发的回调，用于给父组件获取到一些信息。

  onChange?.(_checkSkus, {

    skuName,

    value,

    disabled,

    isChecked: disabled ? false : !isChecked,

    dataItem: curSkuItem,

    stock: curSkuItem?.stock

  })

  if(!disabled) {

    setCheckSkus(_checkSkus)

  }

}

getCurSkuItem 获取当前选中的是哪个sku

• isInOrder.current 是用来判断当前的 skus 数据是否是整齐排列的，这里当成 true 就好，判断该值的过程就不放到本文了，感兴趣可以看 源码。

由于sku是按顺序排列的，所以只需按顺序遍历上面生成的 skuState，找出当前sku选中项对应的索引位置，然后通过 乘 就可以直接得出对应的索引位置。这样的好处是能减少很多次遍历。

如果直接遍历原来那份填充所有 sku 的 data 数据，则需要很多次的遍历，当sku是 6^6 时， 则每次变换选中的sku时最多需要 46656 * 6 (data总长度 * 里面 sku 的 params) 次。

const getCurSkuItem = (_checkSkus: Record<string, string>) => {

  const length = Object.keys(skuState).length

  if(!length || Object.values(_checkSkus).filter(Boolean).length < length) return void 0

  if(isInOrder.current) {

    let skuI = 0;

    // 由于sku是按顺序排列的，所以索引可以通过计算得出

    Object.keys(_checkSkus).forEach((name, i) => {

      const index = skuState[name].findIndex(v => v.value === _checkSkus[name])

      const othTotal = Object.values(skuState).slice(i + 1).reduce((pre, cur) => (pre *= cur.length), 1)

      skuI += index * othTotal;

    })

    return data?.[skuI]

  }

  // 这样需要遍历太多次

  return data.find(s => (

    s.params.every(p => _checkSkus[p.name] === getSkuParamValue(p))

  ))

}

isSkuDisable 判断该 sku 是否是禁用的

该方法是在上面 遍历渲染 skus 列表 时使用的。

const isCheckValue = !!Object.keys(checkSkus).length



const isSkuDisable = (skuName: string, sku: SkuStateItem[number]) => {

  if(!sku.disabledSkus.length) return false

  // 1.当一开始没有选中值时，判断某个sku是否为禁用

  if(!isCheckValue) {

    let checkTotal = 1;

    for(const name in skuState) {

      if(name !== skuName) {

        checkTotal *= skuState[name].length

      }

    }

    return sku.disabledSkus.length === checkTotal

  }



  // 排除当前的传入的 sku 那一行

  const newCheckSkus: Record<string, string> = {...checkSkus}

  delete newCheckSkus[skuName]



  // 2.当前选中的 sku 一共能有多少种组合

  let total = 1;

  for(const name in newCheckSkus) {

    if(!newCheckSkus[name]) {

      total *= skuState[name].length

    }

  }



  // 3.选中的 sku 在禁用数组中有多少组

  let num = 0;

  for(const strArr of sku.disabledSkus) {

    if(Object.values(newCheckSkus).every(str => !str ? true : strArr.includes(str))) {

      num++;

    }

  }



  return num === total

}

至此整个商品sku从生成假数据到sku的选中和禁用的处理的核心代码就完毕了。还有更多的细节问题可以直接查看 源码 会更清晰。

现在大部分网站都有扫码登录功能，搭配相应的App就能免去输入账号密码实现快速登录。本文简单介绍如何实现扫码登录功能。

实现扫码登录

之前参与过一个电视App的开发，采用扫码登录，需要使用配套的App扫码登录后才能进入到主页。那么扫码登录该怎么实现呢？大致流程如下：

PS: 此为大致流程，具体使用需要根据实际需求进行调整。

接下来简单演示一下此流程。

添加依赖库

添加需要的SDK依赖库，在项目app module的build.gradle中的dependencies中添加依赖:

dependencies { 

    // 实现服务端（http、socket）

    implementation("org.nanohttpd:nanohttpd:2.3.1") 

    implementation("org.nanohttpd:nanohttpd-websocket:2.3.1")

    

    // 与服务端通信

    implementation("com.squareup.okhttp3:okhttp:4.12.0")

    

    // 扫描解析、生成二维码

    implementation("com.github.jenly1314:zxing-lite:3.1.0")

}

服务端

使用NanoHttpD实现Socket服务端（与被扫端通信）和Http服务端（与扫码端通信），示例代码如下：

Socket服务

与被扫端保持通讯，在Http服务接收并处理完扫码登录请求后，将获取到的用户id发送给被扫端。

class ServerSocketClient : NanoWSD(9090) {



    private var serverWebSocket: ServerWebSocket? = null



    override fun openWebSocket(handshake: IHTTPSession?): WebSocket {

        return ServerWebSocket(handshake).also { serverWebSocket = it }

    }



    private class ServerWebSocket(handshake: IHTTPSession?) : WebSocket(handshake) {

        override fun onOpen() {}



        override fun onClose(code: WebSocketFrame.CloseCode?, reason: String?, initiatedByRemote: Boolean) {}



        override fun onMessage(message: WebSocketFrame?) {}



        override fun onPong(pong: WebSocketFrame?) {}



        override fun onException(exception: IOException?) {}

    }



    override fun stop() {

        super.stop()

        serverWebSocket = null

    }



    fun sendMessage(message: String) {

        serverWebSocket?.send(message)

    }

}

Http服务

接收并处理来自扫码端的扫码登录请求，通过设备id和用户id判断被扫端是否可以登录。

const val APP_SCAN_INTERFACE = "loginViaScan"



const val USER_ID = "userId"

const val EXAMPLE_USER_ID = "123456789"



const val DEVICE_ID = "deviceId"

const val EXAMPLE_DEVICE_ID = "example_device_id0001"



class ServerHttpClient(private var scanLoginSucceedListener: ((userId: String) -> Unit)? = null) : NanoHTTPD(8080) {



    override fun serve(session: IHTTPSession?): Response {

        val uri = session?.uri

        return if (uri == "/$APP_SCAN_INTERFACE" &&

            session.parameters[USER_ID]?.first() == EXAMPLE_USER_ID &&

            session.parameters[DEVICE_ID]?.first() == EXAMPLE_DEVICE_ID

        ) {

            scanLoginSucceedListener?.invoke(session.parameters[USER_ID]?.first() ?: "")

            newFixedLengthResponse("Login Succeed")

        } else {

            super.serve(session)

        }

    }

}

服务控制类

启动或停止Socket服务和Http服务。

object ServerController {



    private var serverSocketClient: ServerSocketClient? = null

    private var serverHttpClient: ServerHttpClient? = null



    fun startServer() {

        (serverSocketClient ?: ServerSocketClient().also {

            serverSocketClient = it

        }).run {

            if (!isAlive) {

                start(0)

            }

        }



        (serverHttpClient ?: ServerHttpClient {

            serverSocketClient?.sendMessage("Login Succeed, user id is $it")

        }.also {

            serverHttpClient = it

        }).run {

            if (!isAlive) {

                start(NanoHTTPD.SOCKET_READ_TIMEOUT, true)

            }

        }

    }



    fun stopServer() {

        serverSocketClient?.stop()

        serverSocketClient = null



        serverHttpClient?.stop()

        serverHttpClient = null

    }

}

被扫端

Socket辅助类

使用OkHttp与服务端进行Socket通信。

class DevicesSocketHelper(private val messageListener: ((message: String) -> Unit)? = null) {



    private var webSocket: WebSocket? = null



    private val webSocketListener = object : WebSocketListener() {

        override fun onMessage(webSocket: WebSocket, bytes: ByteString) {

            super.onMessage(webSocket, bytes)

            messageListener?.invoke(bytes.utf8())

        }



        override fun onMessage(webSocket: WebSocket, text: String) {

            super.onMessage(webSocket, text)

            messageListener?.invoke(text)

        }

    }



    fun openSocketConnection(serverPath: String) {

        val okHttpClient = OkHttpClient.Builder()

            .connectTimeout(120, TimeUnit.SECONDS)

            .readTimeout(120, TimeUnit.SECONDS)

            .build()

        val request = Request.Builder().url(serverPath).build()

        webSocket = okHttpClient.newWebSocket(request, webSocketListener)

    }



    fun release() {

        webSocket?.close(1000, "")

        webSocket = null

    }

}

被扫端示例页面

先展示二维码，接收到服务端的消息后，显示用户id。

class DeviceExampleActivity : AppCompatActivity() {



    private lateinit var binding: LayoutDeviceExampleActivityBinding



    private var socketHelper: DevicesSocketHelper? = DevicesSocketHelper() { message ->

        // 接收到服务端发来的消息，改变显示内容

        runOnUiThread {

            binding.tvUserInfo.text = message

            binding.ivQrCode.visibility = View.GONE

            binding.tvUserInfo.visibility = View.VISIBLE

        }

    }



    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        binding = LayoutDeviceExampleActivityBinding.inflate(layoutInflater).also {

            setContentView(it.root)

            it.includeTitle.tvTitle.text = "Device Example"

        }



        lifecycleScope.launch(Dispatchers.IO) {

            // 使用设备id生成二维码

            CodeUtils.createQRCode(EXAMPLE_DEVICE_ID, DensityUtil.dp2Px(200)).let { qrCode ->

                withContext(Dispatchers.Main) {

                    binding.ivQrCode.setImageBitmap(qrCode)

                }

            }

        }



        socketHelper?.openSocketConnection("ws://localhost:9090/")

    }



    override fun onDestroy() {

        super.onDestroy()

        socketHelper?.release()

        socketHelper = null

    }

}

扫描端

扫码页

继承zxing-lite库的BarcodeCameraScanActivity类，简单实现扫描与解析二维码。

class ScanQRCodeActivity : BarcodeCameraScanActivity() {



    override fun initCameraScan(cameraScan: CameraScan<Result>) {

        super.initCameraScan(cameraScan)

        // 播放扫码音效

        cameraScan.setPlayBeep(true)

    }



    override fun createAnalyzer(): Analyzer<Result> {

        return QRCodeAnalyzer(DecodeConfig().apply {

            // 设置仅识别二维码

            setHints(DecodeFormatManager.QR_CODE_HINTS)

        })

    }



    override fun onScanResultCallback(result: AnalyzeResult<Result>) {

        // 已获取结果，停止识别二维码

        cameraScan.setAnalyzeImage(false)

        // 返回扫码结果

        setResult(Activity.RESULT_OK, Intent().apply {

            putExtra(CameraScan.SCAN_RESULT, result.result.text)

        })

        finish()

    }

}

扫描端示例页面

提供扫码入口，提供输入框用于输入服务端IP，获取到扫码结果后发送给服务端。

class AppScanExampleActivity : AppCompatActivity() {



    private lateinit var binding: LayoutAppScanExampleActivityBinding



    private var serverIp: String = ""



    private val scanQRCodeLauncher = registerForActivityResult(ActivityResultContracts.StartActivityForResult()) {

        if (it.resultCode == Activity.RESULT_OK) {

            it.data?.getStringExtra(CameraScan.SCAN_RESULT)?.let { deviceId ->

                sendRequestToServer(deviceId)

            }

        }

    }



    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        binding = LayoutAppScanExampleActivityBinding.inflate(layoutInflater).also {

            setContentView(it.root)

        }



        OkHttpHelper.init()



        binding.btnScan.setOnClickListener {

            // 获取输入的服务端ip（两台设备在同一WIFI下，直接通过IP访问服务端）

            serverIp = binding.etInputIp.text.toString()

            if (serverIp.isEmpty()) {

                showSnakeBar("Server ip can not be empty")

                return@setOnClickListener

            }

            hideKeyboard(binding.etInputIp)

            scanQRCodeLauncher.launch(Intent(this, ScanQRCodeActivity::class.java))

        }

    }



    private fun sendRequestToServer(deviceId: String) {

        OkHttpHelper.sendGetRequest("http://${serverIp}:8080/${APP_SCAN_INTERFACE}", mapOf(Pair(USER_ID, EXAMPLE_USER_ID), Pair(DEVICE_ID, deviceId)), object : RequestCallback {

            override fun onResponse(success: Boolean, responseBody: ResponseBody?) {

                showSnakeBar("Scan login ${if (success) "succeed" else "failure"}")

            }



            override fun onFailure(errorMessage: String?) {

                showSnakeBar("Scan login failure")

            }

        })

    }



    private fun hideKeyboard(view: View) {

        view.clearFocus()

        WindowInsetsControllerCompat(window, view).hide(WindowInsetsCompat.Type.ime())

    }



    private fun showSnakeBar(message: String) {

        runOnUiThread {

            Snackbar.make(binding.root, message, Snackbar.LENGTH_SHORT).show()

        }

    }

}

示例入口页

提供被扫端和扫码端入口，打开被扫端时同时启动服务端。

class ScanLoginExampleActivity : AppCompatActivity() {



    private lateinit var binding: LayoutScanLoginExampleActivityBinding



    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        binding = LayoutScanLoginExampleActivityBinding.inflate(layoutInflater).also {

            setContentView(it.root)

            it.includeTitle.tvTitle.text = "Scan Login Example"

            it.btnOpenDeviceExample.setOnClickListener {

                // 打开被扫端同时启动服务

                ServerController.startServer()

                startActivity(Intent(this, DeviceExampleActivity::class.java))

            }

            it.btnOpenAppExample.setOnClickListener { startActivity(Intent(this, AppScanExampleActivity::class.java)) }

        }

    }



    override fun onDestroy() {

        super.onDestroy()

        ServerController.stopServer()

    }

}

效果演示与示例代码

最终效果如下图：

被扫端	扫码端

演示代码已在示例Demo中添加。

ExampleDemo github

ExampleDemo gitee

前言

哈喽各位我又来了，相信大家在做APP的时候肯定会遇到用户Token即将过期或者已经过期的情况，那么这个时候后端都返回相应的Code提示我们要求刷新Token处理。

那么今天这篇文章就给大家提供一个思路。

开工

技术点

• Interceptor -> 拦截器


• ReentrantLock -> 重入锁

实现思路

• 通过TokenInterceptor获取Response解析请求结果验证是否Token过期


• 监控到Token已过期后阻塞当前线程，调用刷新Token接口并使用Lock锁


• 并发的请求也监控到了Token过期后，先校验Lock是否已锁，已锁等待，未锁步骤2


• Token刷新成功后各线程携带新的Token创建Request重新请求

总结：4个并发线程接口，谁抢到了Lock锁谁去刷新Token，其他三个线程阻塞等待

实现代码

private fun handle(name: String) {

    Log.d(TAG, "handle 【Start】 called with: name = $name")

    try {

        if (!mLock.isLocked) {

            this.mLock.lock() // 加锁

            Log.d(TAG, "handle 【Start  Refresh】 called with: name = $name")

            Thread.sleep(5000) // 此处应为刷新Token请求

            Log.d(TAG, "handle 【End Refresh】 called with: name = $name")

            this.mLock.unlock() // 释放锁

        } else {

            Log.d(TAG, "handle 【Wait Refresh】 called with: name = $name")

            while (true) { // 阻塞等待

                if (!mLock.isLocked) { // 查询锁状态

                    Log.d(TAG, "handle 【OK Refresh】 called with: name = $name")

                    break

                }

            }

        }

    } finally {

        if (mLock.isLocked) {

            this.mLock.unlock()

        }

    }

    Log.d(TAG, "handle 【End】 called with: name = $name")

}

如上述代码，抢到Lock锁的线程去刷新Token，其余线程等待结果。

模拟测试

// 此处模拟并发请求

this.findViewById<View>(R.id.btnGo).setOnClickListener {

    thread {

        handle("线程1")

    }

    thread {

        handle("线程2")

    }

    thread {

        handle("线程3")

    }

}

输出日志

如图，线程2抢到了Lock锁，线程1、3则进入了等待状态

如图，线程2刷新Token成功后释放了锁，线程1、3监听到了锁被释放则进入重新请求逻辑

实践代码

class TokenInterceptor : Interceptor {



    @Volatile

    private var mRefreshInvalidTime = 0L



    @Volatile

    private var isRefreshToken = false

    

    private val mRefreshTokenLock by lazy { ReentrantLock() }



    private val mAccountRep by lazy { .... }



    override fun intercept(chain: Interceptor.Chain): Response {

        val request = chain.request()

        // 接口过滤Token校验

        val ignoreToken = request.headers[HeaderConstant.IGNORE_TOKEN_NAME]

        if (ignoreToken == HeaderConstant.IGNORE_TOKEN_VALUE) {

            return chain.proceed(request)

        }

        val response = chain.proceed(request)

        if (HttpFactory.bodyEncoded(response.headers)) {

            return response

        }

        // 解析反参Json

        val result = HttpFactory.bodyToString(response) ?: ""

        if (!TextUtils.isEmpty(result)) {

            val resp = result.convert<BaseResp<Any>>()

            // 校验Token是否过期

            if (ResponseConstant.isTokenExpire(resp.code)) {

                return onTokenRefresh(chain, response) ?: kotlin.run { response }

            }

            // 校验Token是否失效

            if (ResponseConstant.isTokenInvalid(resp.code)) {

                this.onTokenInvalid(response)

            }

        }

        return response

    }



    /**

     * Token 刷新

     */

    private fun onTokenRefresh(chain: Interceptor.Chain, response: Response): Response? {

        var newResponse: Response? = response

        try {

           if (!mRefreshTokenLock.isLocked) {

                this.mRefreshTokenLock.lock()

                this.isRefreshToken = true

                runBlocking {

                    launch(Dispatchers.Default) {

                        newResponse = requestAuthToken(chain, response)

                    }

                }

                

                this.mRefreshTokenLock.unlock()

                this.isRefreshToken = false

            } else {

                while (true){

                    if (!isRefreshToken){

                        newResponse = doRequest(chain)

                        break

                    }

                }

            }

        } catch (e: Exception) {

            // do something

        } finally {

            if (mRefreshTokenLock.isLocked) {

                this.mRefreshTokenLock.unlock()

                this.isRefreshToken = false

            }

        }

        return newResponse

    }





    /**

     * Token 失效

     */

    private fun onTokenInvalid(response: Response) {

        response.close()

        // 防抖

        val currentTime = System.currentTimeMillis()

        if ((currentTime - mRefreshInvalidTime) > KET_TOKEN_INVALID_ANTI_SHAKE) {

            this.mRefreshInvalidTime = currentTime

            // 跳转登录页 or 自行逻辑

            ...

        }

    }

    

    /**

     * 请求 刷新Token

     */

    private suspend fun requestAuthToken(chain: Interceptor.Chain, response: Response): Response? {

        var newResponse: Response? = response

        val resp = .... // 请求代码

        if (resp.isSuccess()) {

            response.close()

            resp.data?.let { data -> .... //更新本地Token }

            newResponse =  doRequest(chain)

        }

        return newResponse

    }



    private fun doRequest(chain: Interceptor.Chain): Response? {

        var response: Response? = null

        try {

            val newRequest = HttpFactory.newRequest(chain.request()).build()

            response = chain.proceed(newRequest)

        } catch (e: Exception) {

            // do something

        }

        return response

    }



    companion object {

        const val KET_TOKEN_INVALID_ANTI_SHAKE = 2000

    }

}

End

到这里就结束了，简单吧，希望可以帮到在座的小伙伴们。当然如果有更好的实现方式或方案也希望各位在评论区留言讨论，我秒回复哦~ Bye

在Android开发中，我们总是会碰到各种各样的适配问题。如果要解决适配问题，我们必须就要解决，出现问题的是什么机型？出现问题的是什么系统？怎么判断当前机型是不是出问题的机型？这几个问题。这篇文章，就将介绍如何判断机型和系统，介绍目前应该如何解决这些问题。

判断指定的机型

在Android里面可以通过 android.os.Build这个类获取相关的机型信息，它的参数如下：（这里以一加的手机为例）

Build.BOARD = lahaina

Build.BOOTLOADER = unknown

Build.BRAND = OnePlus //品牌名

Build.CPU_ABI = arm64-v8a

Build.CPU_ABI2 = 

Build.DEVICE = OP5154L1

Build.DISPLAY = MT2110_13.1.0.100(CN01) //设备版本号

Build.FINGERPRINT = OnePlus/MT2110_CH/OP5154L1:13/TP1A.220905.001/R.1038728_2_1:user/release-keys

Build.HARDWARE = qcom

Build.HOST = dg02-pool03-kvm97

Build.ID = TP1A.220905.001

Build.IS_DEBUGGABLE = false

Build.IS_EMULATOR = false

Build.MANUFACTURER = OnePlus //手机制造商

Build.MODEL = MT2110 //手机型号

Build.ODM_SKU = unknown

Build.PERMISSIONS_REVIEW_REQUIRED = true

Build.PRODUCT = MT2110_CH //产品名称

Build.RADIO = unknown

Build.SERIAL = unknown

Build.SKU = unknown

Build.SOC_MANUFACTURER = Qualcomm

Build.SOC_MODEL = SM8350

Build.SUPPORTED_32_BIT_ABIS = [Ljava.lang.String;@fea6460

Build.SUPPORTED_64_BIT_ABIS = [Ljava.lang.String;@3a22d19

Build.SUPPORTED_ABIS = [Ljava.lang.String;@2101de

Build.TAGS = release-keys

Build.TIME = 1683196675000

Build.TYPE = user

Build.UNKNOWN = unknown

                                                                            Build.USER = root

其中重要的属性已经设置了注释，所有的属性可以看官方文档。在这些属性中，我们一般使用 Build.MANUFACTURER 来判断手机厂商，使用 Build.MODEL 来判断手机的型号。

tips: 如果你是使用kotlin开发，可以使用 android.os.Build::class.java.fields.map { "Build.${it.name} = ${it.get(it.name)}"}.joinToString("\n") 方便的获取所有的属性

上面的获取机型的代码在鸿蒙系统（HarmonyOS）上也同样适用，下面是在华为P50 Pro的机型上测试打印的日志信息：

Build.BOARD = JAD

Build.BOOTLOADER = unknown

Build.BRAND = HUAWEI

Build.CPU_ABI = arm64-v8a

Build.CPU_ABI2 = 

Build.DEVICE = HWJAD

Build.DISPLAY = JAD-AL50 2.0.0.225(C00E220R3P4)

Build.FINGERPRINT = HUAWEI/JAD-AL50/HWJAD:10/HUAWEIJAD-AL50/102.0.0.225C00:user/release-keys

Build.FINGERPRINTEX = HUAWEI/JAD-AL50/HWJAD:10/HUAWEIJAD-AL50/102.0.0.225C00:user/release-keys

Build.HARDWARE = kirin9000

Build.HIDE_PRODUCT_INFO = false

Build.HOST = cn-east-hcd-4a-d3a4cb6341634865598924-6cc66dddcd-dcg9d

Build.HWFINGERPRINT = ///JAD-LGRP5-CHN 2.0.0.225/JAD-AL50-CUST 2.0.0.220(C00)/JAD-AL50-PRELOAD 2.0.0.4(C00R3)//

Build.ID = HUAWEIJAD-AL50

Build.IS_CONTAINER = false

Build.IS_DEBUGGABLE = false

Build.IS_EMULATOR = false

Build.IS_ENG = false

Build.IS_TREBLE_ENABLED = true

Build.IS_USER = true

Build.IS_USERDEBUG = false

Build.MANUFACTURER = HUAWEI

Build.MODEL = JAD-AL50

Build.NO_HOTA = false

Build.PERMISSIONS_REVIEW_REQUIRED = true

Build.PRODUCT = JAD-AL50

Build.RADIO = unknown

Build.SERIAL = unknown

Build.SUPPORTED_32_BIT_ABIS = [Ljava.lang.String;@a90e093

Build.SUPPORTED_64_BIT_ABIS = [Ljava.lang.String;@8ce98d0

Build.SUPPORTED_ABIS = [Ljava.lang.String;@366a0c9

Build.TAGS = release-keys

Build.TIME = 1634865882000

Build.TYPE = user

Build.UNKNOWN = unknown

综上，判断手机厂商的代码如下：

//是否是荣耀设备

fun isHonorDevice() = Build.MANUFACTURER.equals("HONOR", ignoreCase = true)

//是否是小米设备

fun isXiaomiDevice() = Build.MANUFACTURER.equals("Xiaomi", ignoreCase = true)

//是否是oppo设备

//realme 是oppo的海外品牌后面脱离了；一加是oppo的独立运营品牌。因此判断

//它们是需要单独判断

fun isOppoDevice() = Build.MANUFACTURER.equals("OPPO", ignoreCase = true)

//是否是一加手机

fun isOnePlusDevice() = Build.MANUFACTURER.equals("OnePlus", ignoreCase = true)

//是否是realme手机

fun isRealmeDevice() = Build.MANUFACTURER.equals("realme", ignoreCase = true)

//是否是vivo设备

fun isVivoDevice() = Build.MANUFACTURER.equals("vivo", ignoreCase = true)

//是否是华为设备

fun isHuaweiDevice() = Build.MANUFACTURER.equals("HUAWEI", ignoreCase = true)

需要判断指定的型号的代码则为：

//判断是否是小米12s的机型

fun isXiaomi12S() = isXiaomiDevice() && Build.MODEL.contains("2206123SC") //xiaomi 12s

如果你不知道对应机型的型号，可以看基于谷歌维护的表格，支持超过27,000台设备。如下图所示：

判断手机的系统

除了机型外，适配过程中我们还需要考虑手机的系统。但是相比于手机机型，手机的系统的判断就没有统一的方式。下面介绍几个常用的os的判断

● 鸿蒙

private static final String HARMONY_OS = "harmony";

/**

* check the system is harmony os

*

* @return true if it is harmony os

*/

public static boolean isHarmonyOS() {

    try {

        Class clz = Class.forName("com.huawei.system.BuildEx");

        Method method = clz.getMethod("getOsBrand");

        return HARMONY_OS.equals(method.invoke(clz));

    } catch (ClassNotFoundException e) {

        Log.e(TAG, "occured ClassNotFoundException");

    } catch (NoSuchMethodException e) {

        Log.e(TAG, "occured NoSuchMethodException");

    } catch (Exception e) {

        Log.e(TAG, "occur other problem");

    }

    return false;

}

● Miui

fun checkIsMiui() = !TextUtils.isEmpty(getSystemProperty("ro.miui.ui.version.name"))



private fun getSystemProperty(propName: String): String? {

    val line: String

    var input: BufferedReader? = null

    try {

        val p = Runtime.getRuntime().exec("getprop $propName")

        input = BufferedReader(InputStreamReader(p.inputStream), 1024)

        line = input.readLine()

        input.close()

    } catch (ex: IOException) {

        Log.i(TAG, "Unable to read sysprop $propName", ex)

        return null

    } finally {

        if (input != null) {

            try {

                input.close()

            } catch (e: IOException) {

                Log.i(TAG, "Exception while closing InputStream", e)

            }

        }

    }

    return line

}