【自作するLINE着せ替え】~上部と下部の色を変える方法~

コメント欄で頂いたので記事にします。多分シリーズ化。

上部と下部ってどこ?

上下にある濃いピンク色の部分です
IMG_9998

下部の色の変え方

下部はimageフォルダの中にある「line_GNB_bg@2x.png」をGIMPなどを使い好きな色に変更してください。
今回は紫に変えてみました!

sdsadsd

上部の色の変え方

上部もimageフォルダの中にある「tm_topbar@2x.png」と「tm_topbar_128@2x.png」の色を変更してください。
下部と同じように紫色にしてみました!

jbwenfdkljf

上部のボタンの色の変え方

さて、気づいた方もいると思います。ボタンの色が変わってない…
ボタンの色は「tm_topbar@2x.png」と「tm_topbar_128@2x.png」を変更しただけでは変わりません!
imageフォルダの中にある「navigation_btn_01@2x.png」「navigation_btn_01_02_tab@2x.png」「navigation_btn_02@2x.png」「navigation_btn_02_tab@2x.png」「searchbar_btn_cancel@2x.png」「searchbar_btn_cancel_on@2x.png」、更にtimelineフォルダの中にある「tm_topbar_btn_back@2x.png」「tm_topbar_btn_back_pressed@2x.png」を変えることで一通り、ボタンの色を変更することが出来ます。

ボタンを背景と同じ色にすると見辛い気がします‥
私は上部の色に合わせて濃い目の紫にしてみました!

ddddddd

下部の文字の色の変え方

下部を暗めの色にすると友達、トーク、タイムライン、その他が見辛いので文字色を変えてみましょう!
theme.jsonを開き「”background.image.pattern”: true,」と文字検索してください。すると下のような文字列を見つけることが出来ると思います。
“background.image.pattern”: true,
“text.color”: {
“pressed”: “#ffffff“,
“normal”: “#900138
},
上記の赤文字の部分を好きな色のカラーコードに変更してください。
pressedは選択時の色、normalは選択していない時の色です。

カラーコードがわからない場合は下記URLのサイトを参考に変更してください!

私はシンプルに選択時は黒、非選択時は白にしました
sdsadsd

下部の文字の影の消しかた

よーく見ると友達、トーク、タイムライン、その他には影がついています。邪魔な場合は消しちゃいましょう!
theme.jsonを開き「”background.image.pattern”: true,」と文字検索してください。赤文字部分を消しちゃいましょう。
“text.shadow”: {
“pressed”: “#470016, 0.4”,
“normal”: “#ffb5cc, 0.5”,
“offset”: “0px 1px”
},

“background.image.pattern”: true,

これで影を消すことが出来ました!

影の色の変え方

影の消しかたのように検索し、下記を見つけ赤文字部分のカラーコードを自分の好きな色に変更してください!
“text.shadow”: {
“pressed”: “#470016, 0.4″,
“normal”: “#ffb5cc, 0.5″,
“offset”: “0px 1px”
},
“background.image.pattern”: true,


今回は以上になります。明日か明後日には次の記事を書きますのでどうかよろしくお願いしますm(_ _)m
至らない点はコメントで指摘して頂けたら幸いです。。

スポンサーリンク
スポンサーリンク

スポンサーリンク
スポンサーリンク
スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存

フォローする