爲彩六搓了個R6 Operators Icons

先上成品效果

按我的喜好程度排序

R6 Operators Icons:

一個提供 彩虹六號:圍攻X 幹員SVG圖標的API和靜態資源庫,適用於網頁、機器人和創意項目。現在,你可以在你的個人博客上像展示“Skill”一樣方便且快捷地展示你擅長/喜愛的幹員!

項目已在Github開源,歡迎各位Star!

R6-Operators-Icons

使用例[進攻方]:

https://r6.zyc.su/api/icons?i=recruit_blue,fuze,buck,blitz,montagne,nokk,ash

使用例[防守方]:

https://r6.zyc.su/api/icons?i=recruit_red,rook,kapkan,mute,smoke,jager,azami

支持單個/多個調用,只需要在api後面輸入自己想要的幹員的英文名稱,再用英文的 “ , ” 隔開即可,每行默認15個,自定義參數支持調節,具體看文檔。


然後嘮一嘮爲甚搓這個:

起因是最近收拾了一下[個人主頁]( zyc.su ),同類主頁基本都有個“Skill Show”的欄目,展示的是一些以生產力軟件/開發語言爲主的圖標,我尋思我一菜雞沒必要展示這些啊,思來想去決定整一個彩六相關的“Skill”。

大部分人的Skill

於是網上搜了一圈,沒有,原Skill Icon項目也不接受遊戲圖標Pr,好在代碼開源,開搓!

程序部分找了個現成的開源項目:skill icons

拿來用,僅調用圖標的部分基本沒怎麼改,可以直接拿來部署。

圖標部分則找了:R6Operators

這是一個專門收集製作R6幹員圖標的項目,提供SVG和PNG兩種格式的幹員圖標。

當時想:這敢情好啊,估計幾分鐘就搓完了。

哪想這是頭疼的開始,從R6Operators找來的SVG看着很正常,文件丟倉庫裏也看着挺正常,結果實際上手就拉閘,直接報錯文件22行有一些奇怪的信息。

好嘛,打開文件一看,嚇一跳,除了必要的圖片信息外,密密麻麻一堆的Adobe信息和註釋,我就說怎麼報錯,加上之前這方面沒怎麼研究過,便開始摸索着清理。

在研究了好一陣子後,不報錯能顯示了,但又只有底色,又研究了一下,發現R6Operators的SVG是多層繪製的(也正常),繼續研究吧......

過程不多贅述了,你們不感興趣的,最後是進行了圖層合併等操作,終於可以正常展示了,像這樣:

很快啊,我又試了試多個調用,拉閘,還是單色。後面看了看,多個圖標在一起會合並一些東西,本身圖標是多層,再多個圖標多層嵌套,套娃下來出問題了。

還能怎麼辦,改唄。

這一塊地方對之前沒接觸過這方面的我來講是最頭疼的,在經歷了各種奇葩bug後,debug半天終於調試好了。

後面順帶解決了一下大小問題,統一大小,看着很舒服。

個人主頁示例 [zyc.su]

在別人還在展示Java,Nodejs,Python,Go的時候,我已經在展示我的416秋之鶴和C8黑曜石

秋之鶴

黑曜石

最後:

歡迎各位使用,有不懂的先去看文檔,再去問AI,最後再問人,項目個人定義爲玩具項目,搓着玩,大家圖一樂開心就好,但之後會更新新的幹員圖標。

後面可能會考慮添加別的遊戲的圖標,接受Pr。

更多遊戲資訊請關註:電玩幫遊戲資訊專區

電玩幫圖文攻略 www.vgover.com