前言 這篇文章主要是關於移動端原筆跡的開發,讓平板上的手寫效果達到筆跡光滑且有筆鋒。 介紹關於原筆跡的演算法思路。 項目github地址 演算法思路分析 曲線擬合演算法 利用曲線擬合演算法增加虛擬的點,使得筆跡更加光滑,關於演算法思想本文采用的是B樣條插值演算法。 採集點:獲取筆輸出的兩個關鍵點a1、a2,以及 ...
前言
這篇文章主要是關於移動端原筆跡的開發,讓平板上的手寫效果達到筆跡光滑且有筆鋒。
- 介紹關於原筆跡的演算法思路。
- 項目github地址
演算法思路分析
曲線擬合演算法
利用曲線擬合演算法增加虛擬的點,使得筆跡更加光滑,關於演算法思想本文采用的是B樣條插值演算法。
採集點:獲取筆輸出的兩個關鍵點a1、a2,以及a1和a2附近的幾個點a3,a4;
擬合點:利用a1,a2,a3,a4計算出a1和a2之間曲線的步長,再根據步長計算出a1與a2之間所有的點,所
計算出的點即為曲線上的點;
簡單圖示:
梯形填充筆跡
利用梯形填充思想來實現筆鋒的效果。
獲取筆寬:獲取到a1與a2兩點筆的壓力,轉換成對應的寬度作為此段起點和終點的寬度d1,d2,以d1與、
d2差再除以a1與a2點之間的個數得到曲線點之間筆寬的差值,再計算出該段曲線上所有點a1,b1...bn,a2
對應的筆寬l1...ln;
計算梯形:利用曲線上相鄰的點和對應的筆寬計算出梯形,利用圖形模塊的填充效果將梯形填充;
處理梯形連接處:對於每個梯形連接處,根據此處關鍵點特征區分為不做處理,畫線以及畫橢圓,並且
將連接處填充,即生成原筆跡效果;
簡單圖示:
項目地址
關於github代碼地址:https://github.com/doubledouble123/Pens
手寫效果展示:
總結
本文通過曲線擬合演算法和梯形填充演算法完成了原筆跡效果的實現,增加了平板的書寫體驗。