画面の端を丸くしてステータスバーとナビゲーションバーからホーム画面を分離させる

|

ステータスバーとナビゲーションバー部分を黒く塗りつぶし、残った部分をさらに角丸にすると塗りつぶした部分がうまく端末前面パネルの黒に溶け込んで、なんかいい感じになる…ということに最近気づきました。

実機で見ると良くなるホーム画面

AQUOS SERIE miniで見ると、ちょっと端末下部が太すぎて不格好な気もしますが、上部の方はステータスバーがうまく端末に溶け込んでいるような感覚になります。

これがスクリーンショットだけだと、上下の黒い部分から小さな角が生えているようで変なのですが、実際の端末に表示させると案外悪くないです。

ステータスバーやナビゲーションバーを非表示にはしたくないけど、ホーム画面の中にあるとどうもデザイン的に邪魔になってしまう、うまく組み込めない時にこの方法を使うとうまく分離できるので便利です。

KLWPでのかんたんなやり方

この中心部だけを角丸で表示させる、というのは方法はいくらでもあると思いますが、今回はKLWPを使ってやってみます。

1.一番最後にグループ化(重ねる)を作成

まずはレイヤーの一番最後に「グループ化(重ねる)」を作成します。

2.全体を覆う黒い長方形を作成

グループ化(重ねる)の中に「図形」を作成し、長方形で幅と高さを画面いっぱいに広げます。幅は$si(rwidth)$、高さは$si(rheight)$と入力すると自動で値を計算してくれます。
このほか、塗りは黒にして塗りつぶしましょう。これで全体が黒い図形で覆い尽くされました。

3.ステータスバーとナビゲーションバー分小さな図形を作成

2.で作成した図形をコピーしてもう1個作ります。(分かりやすくするため上の図では色をピンクに変えています。)その高さの値を$si(rheight)-140$として、ステータスバーとナビゲーションバー分だけ小さくします。

そして「位置」で基準位置を「上」、余白(上)を50にセットします。これで上下にステータスバーとナビゲーションバーの黒帯ができました。(大抵は上の数値でちょうどいい大きさになると思いますが、ズレる場合は適宜調整してください。)

4.Clearに設定してくり抜く

2個めに作った図形の「塗り」タブに移動して「加工」をタップ、「Clear」に設定します。こうすると、この図形部分がくり抜かれ、下に表示されていた部分が見えるようになります。

5.角丸の大きさを調整する

最後に、図形タブに戻って「角」の大きさを変更し、角丸にしていきます。20くらいが大きすぎず、さりげないくらいでちょうどいいと思います。(上の図は分かりやすくするために値を大きくしています。)

これで完成です。

まとめ

前面パネルが白い端末だと、この手を使っても不格好になってしまうかも知れませんが、黒い端末であればなかなかうまく見えると思います。

最近はこれまでよりも縦長なディスプレイを持ったスマホも多く出てきています。縦長すぎてデザイン的にも苦労するのですが、今回の方法で上下を区切ってしまうことで少しでも縦の長さを抑える、ということもできるかもしれません。全面ディスプレイ感はなくなってしまうかもしれませんが。

スクリーン上で見ているのと実際に自分の端末でやってみるのとでは印象がけっこう変わります。興味があったらぜひ試してみてください。

Random Posts

Unihertz Titanにミヤビックスの低反射タイプ保護フィルムOverLay Plusを購入!手触りが格段にアップ!
格安SIM (MVNO) 速度比較 : 2018年3月その2 b-mobile Sは落ち、イオンモバイルタイプ2が浮上
UMIDIGI A3 と UMIDIGI One Pro のプレセールがAliExpressにて開催!
Seven Time:無料で7つのスタイルを持ち、簡単なカスタマイズ可能な時計ウィジェット
うっかり大量通信防止 (Wi-Fi確認通知):Wi-Fiオフでアプリを起動すると通知が出るアプリ
CHUWI MiniBook レビュー:持ち歩きたくなるコンパクト端末!4.5万円でしっかり使える8インチUMPC
Notch Remover:ノッチの左右を黒く塗りつぶして目立たなくするアプリ
カードUIを目指してみた【あなたのホーム画面見せてください 2019】
Twitterアプリ、何使ってる?アンケート2019【結果発表 その1】
HUAWEI Honor Band 5 レビュー:血中酸素飽和度(SpO2)の測定もできるファーウェイの比較的安価なスマートバンド
最近良さげなb-mobileの格安SIMを今更ながら見直してみる
Android P Betaがリリース!Xperia XZ2やEssential Phone PH‑1でもインストール可能
追加のショートカット:ライトのオン/オフや画面の明るさ変更のショートカットを作成するアプリ
【アンケート】Androidスマホの日本語入力(キーボード)アプリなに使ってますか?
Unihertz Titan レビュー:意外と使えるし使って楽しい!重くてデカくて物理キーボード搭載のタフネススマホ