記一次對設計稿的思考，涉及簡單的數(shù)學問題贱除。
如上圖所示外冀，是我從設計師手中拿到的一小部分設計稿寡键。它是一個時間選擇組件，以每半個小時作為最小刻度的色塊拼裝而成的組件雪隧。色塊從左到右分別代表“過期”西轩、“禁用”、“選中”脑沿、“可選”遭商。
這里，請關注最左邊的顏色塊捅伤，它代表的是已經(jīng)過去的時間段劫流，跟最右邊的白色色塊一樣也是多個“半小時”色塊左右拼接實現(xiàn)背景拼接的。這就讓我產(chǎn)生了一個疑問：怎么樣畫等間距斜線可以實現(xiàn)多個“半小時”色塊左右拼接時丛忆，線與線可以無縫重疊祠汇？
我用sketch畫了個目標效果，右上方就是我要的效果熄诡。
根據(jù)設計稿的尺寸和效果可很，我可以測量“半小時”色塊的長和寬，斜線的斜率和間距凰浮，按照設計稿的數(shù)據(jù)進行繪制就可以繪制出想要的效果我抠。
但我無法滿足于這種具有的特殊的數(shù)值產(chǎn)生的結(jié)果。我需要從特殊到一般袜茧，使用數(shù)學模型描述這種規(guī)律菜拓。
在討論了下面幾個觀點（未必正確）：
- 長方形與斜線構(gòu)成的圖形是中心對稱圖形。
- 斜線會等分長方形的對角線笛厦。（群友“Aliang”的觀點）
- 平行并且垂直方向間距的整數(shù)倍等于h纳鼎，水平整數(shù)倍等于w。（某條“98年的咸魚”群友的觀點）
- 如果某條線與長方形左側(cè)的交點存在裳凸，則長方形右側(cè)必有另外一條線與之相交贱鄙，且高度位置跟左側(cè)的交點一樣。（群友“C”的觀點）
...
實際上觀點4與我不謀而合姨谷。如果我把長方形與某一條線構(gòu)成的圖形作為一個獨立單元看待逗宁。當我在右側(cè)拼接這個另一個這樣的單元時，左右這兩個單元存在著一種平移關系梦湘。詞窮描述不清楚瞎颗，看下方的圖片件甥。為了達到左側(cè)的效果，實際上可以從右側(cè)向上平移言缤。反過來思考嚼蚀，從左側(cè)圖形到右側(cè)的圖形隱約可以告訴我一種數(shù)學可描述的規(guī)律禁灼。
所以我假設每個“半小時”色塊長方形的寬為w管挟、高為h。斜線的斜率是k（垂直于長方形垂直邊的線不在考慮范圍之內(nèi)弄捕，它不存在所謂的線與線無縫重疊）僻孝，線與線之間的間距為b。
在二維坐標系中守谓，取相鄰兩個長方形拼接后的左下角為坐標原點穿铆。則長方形的右邊x=w和x=2w與x軸留下了連個特殊的交點，分別為(w,0)和(2w,0)斋荞。
由于長方形左右拼接時線段可以無縫重疊荞雏。也就是說當有一條線l1與第一個長方形的右邊x=w相交于點(w,C)時，必有另一條線l2與第二個長方形的右邊x=2w相交于點(2w,c)平酿。
如下圖所示：
再一次假設l1與l2之間隔著i條線凤优。則可以在二維坐標系中描述l1和l2如下圖所示。其中l(wèi)2在l1下方蜈彼。
l1: y = kx + a
l2: y = kx + a - (i+1)b
其中a為l1的相位筑辨，即與y軸的交點縱坐標。
l1與x=w的交點縱坐標C=kw+a幸逆；l2與x=2w的交點縱坐標為C=2kw+a-(i+1)b
既有
kw + a = 2kw + a - (i+1)b
約項得到我最終想要的規(guī)則：
k = (1+i)b/w
對這個規(guī)則的解釋是棍辕，對于給定的長方形寬度w，斜線間距b还绘，以及控制密度的i楚昭，就可以確定斜線的走向。從而使得在長方形上畫出的線可以另長方形左右拼接時可以無縫重疊拍顷。
