ね子にゃらぁと

未公開プロジェクト



このブログの人気の投稿

アプリ開発備忘録: ③ Android 15からはEdge-to-Edge表示が強制適用に (Part 3)

Android 15以降から画面のEdge-to-Edge表示が強制適用になって、同時に画面上部の時間やバッテリーの残量が表示される「ステータスバー」の背景が透明になりました。 「 パート２ 」では、強引にスタータスバーの背景色を設定する方法を確認しましたが、この方法だと背景色の色を設定できるタイミングに少しの制限が入ります。 なので今回は。違う方法でステータスバーの背景色を設定する方法をこの備忘録に残しておきます。 [目次] パート 1 Edge-to-Edge表示 (Android アプリ) テストアプリを使って確認 ターゲットSDKバージョンを35に変更 ステータスバーとAppBarが重ならない様にする例 (XMLレイアウト) ※:強制適用されるEdge-to-Edge表示を一時的に無効にする方法 (SDK 35) パート 2 Android15よりも前のデバイスでもEdge-To-Edge表示 ステータスバーの背景色 パート 3 (このメモ) パート２で確認した背景色を設定する方法 別の方法 例: JetPack Compose 例: Flutter 追記 パート２で確認した背景色を設定する方法 import android.graphics.Color import android.os.Build import android.view.View import android.view.Window import android.view.WindowInsets : : : : class MainActivity : ComponentActivity() { fun setStatusBarColor ( window : Window, color : Int) { ...
Read more »

『コメ欄』用カスタムCSS - L◯NE風 (ツイキャス) - OBSのブラウザでも使えます。

イメージ
関連サイトの「 kiiのメモ帳 」で公開している『 L◯NEの会話画面風のツイキャスコメ欄カスタムCSS (シンプル版) 』ですが、 『 コメ欄 』のアプリ内表示モードでカメラ機能を使う場合に、吹き出しの背景に映る部分の画像が吹き出しの色と似ていると、コントラストの関係で吹き出し部と背景が同一化してしまうので、吹き出し部に 囲いの線 又は 色付きの影 のどちらかを追加で表示出来る様に変更してみました。 因みに以前のカスタムCSSでは、吹き出しの根元部は「◣」を使って再現していましたが、今回はカール付きで弧を描いているので少し再現度が向上しています。 このページの後方にある 設定 の部分で囲い線と影の他に、文字の大きさや色などをクリックでCSSをカスタマイズする事が出来ます。 カスタマイズ後は カスタムCSS の下にある CSSをクリップボードにコピー をクリックするとカスタムCSSがクリップボードにコピーされます。 [目次] 囲いの枠線と影の例 カスタムCSS LINE風 (コメ欄用) 設定 (Part-1) サンプル 設定 (Part-2) スマホアプリ 『コメ欄』での使用例 影を吹き出しの下方向に表示する方法 更新履歴 L◯NEの会話画面風のツイキャスコメ欄カスタムCSS シンプル版 @ メモ帳 (別サイト) x４バージョン : アイコンサイズ変更可 @ メモ帳 (別サイト) 幅細めバージョン : 狭い幅で表示したい時用 @ メモ帳 (別サイト) 『コメ欄』用カスタムCSS : 吹き出しの周りに枠線又は影の表示が可能 (このページ) 囲いの枠線と影の例 次に吹き出しに囲い線/影を設定した場合のコメント欄のスクショを例のとして貼っておきます。 囲い線と影の色は設定で、違う色にする事が可能なのと、ユーザー名やユーザーI...
Read more »

[OBS] Twitchコメント欄向けCSSカスタマイザー (試作)

イメージ
( Twitch Chat Overlay CSS Customizer Prototype ) Chrome拡張機能の「 TwitchコメカスタムCSSテスター 」をChromeウェブストアで公開していますが、この拡張機能に読み込ませるテスト用のカスタムCSSも必要だと思ったので、Twichのコメント欄 (チャットオーバーレイ) 向けの簡単なCSSカスタマイザーをここに置いておきます。 このページでクリップボードにコピー出来るCSSを使うと、Twitchのチャット欄をポップアップして表示したコメント欄のURLを使って表示するオーバーレイを、マウス操作でカスタマイズする事が出来ます。 [目次] Twitchのコメント欄 (チャットオーバーレイ) カスタムCSS コメント欄サンプル 設定 更新履歴 TwitchコメカスタムCSSテスター サポートページ #Twitchコメカスタム   ( #ツイッチコメ欄カスタムCSS 、 #トイッチコメ欄カスタムCSS ) Twitchのコメント欄 (チャットオーバーレイ) Twitchのライブ配信をパソコンのブラウザで視聴する時にウインドウの右側に表示されるコメント欄を、「チャットをポップアウト」でポップアップすると https://www.twitch.tv/popout/ ユーザー名 /chat?popout= というURLでコメント欄が別のウインドウで表示されます。 配信ソフトの「OBS」のブラウザや、Chrome拡張機能の「 TwitchコメカスタムCSSテスター 」を使って、上記のURLにこのページのカスタムCSSを読み込ませて表示すると、標準のTwitchコメント欄とは違うレイアウトにカスタマイズして表示する事が出来ます...
Read more »

アプリ開発備忘録: ① Android 15からはEdge-to-Edge表示が強制適用に (Part 1)

イメージ
少し前に手持ちのAndroid携帯の一つにシステムのアップデートが入ったのですが、それ以降、いくつかのアプリで、画面の上下の表示がおかしくなってしまいました。。。 実は、このアップデートでアンドロイドOSが「 アップサイドダウンケーキ 」(Android 14, SDK 34)から「 バニラアイスクリーム 」 (Android 15, SDK 35) に更新されて、Android 15からはアプリの表示がデフォルトで Edge-to-Edge (端から端まで) 表示 の仕様、つまり全画面表示になったのが原因でした。 (👉「📑 動作の変更点: Android 15 以上をターゲットとするアプリ 」) これまでもアプリを画面の端から端までの全画面で表示する「 没入モード 」という機能があったので、そのモードでの画面表示がデフォルトになったという理解に少し近いのですが。。。 実際はそうではありません。 没入モードの場合は、アプリが全画面で表示される以外に、「 システムバー 」と呼ばれる、画面の上部に表示される「ステータスバー (Status Bar)」と下部に表示される「ナビゲーションバー」の表示を必要に応じて表示/非表示に出来るほか、非表示の場合でもユーザーの操作によっては再表示される仕様になっています。 (👉「📑 没入モードのシステムバーを非表示にする 」) Status Bar と App Bar Android 15よりも前のOSでは 、没入モード以外では、アプリは全画面にではなく、 自動的に 上下のシステムバーの分が差し引かれた部分だけに表示される仕様になっていて、アプリの表示が上下のシステムバーに重なって表示される事がない様になっていました。 Android 15以降からは 、システムバーの表示/非表示に関係なく、アプリの表示サイズが端から端までの全画面表示になるので、必要に応じて、 インセット(Inset) 情報などを使ってアプリの表示コンテンツがシステムバーの表示と重ならない様に調整する必要があります。。。。。 ...
Read more »

[ツイキャス配信・閲覧支援ツール] キャスポケットツール: 初期設定

イメージ
ツイキャス配信・閲覧支援機能をいくつか搭載したアプリ、 『 キャスポケットツール 』 （ Android ｜ iOS ） を作ってみました。 ツイキャス のユーザーやライブ配信を検索する機能をはじめ、自分のサポート・サポーターを閲覧したり、気になるユーザーを登録してライブ配信の通知を有効にしたりする事が出来ます。 このアプリの機能を使うのには、 アプリを ツイキャスのアカウントに連携 する必要がある他、 Android 13とそれ以前 のAndroidでは、 バックグラウンド処理を有効 にすると、登録した「気になるユーザー」のライブ配信開始の通知を受け取れる確率が上がるので、 ここに『キャスポケットツール』を使うのに 最低限必要な初期設定 をメモしておきます。 [目次] キャスポケットツールの機能 初期設定 バックグラウンド処理の有効化 iOS Android 13とそれ以前のAndroid 備考 関連メモ #キャスポケットツール キャスポケットツール Android版 by kii_memo_jp iPhone/iPad版 by BIBO-HQ キャスポケットツールの機能 メイン画面 現時点では次の機能が搭載されていて、アプリのメイン画面から選択する事が出来ます。 ...
Read more »

ツイキャスで他の人がサポートしている人って見えますか？ (キャスポケットツール)

イメージ
[目次] 知恵袋の質問 アンサー: キャスポケットツール 例: キャスくんのサポートリスト 関連メモ キャスポケットツール 機能説明 ツイキャス関連メモ 知恵袋の質問 Yahoo知恵袋に次の様な質問があったのですが: 自分がツイキャスで誰をサポートしているかって、他の人から見えちゃいますか？ 誰かは見えなくても、何人サポートしてるとか見えますか？ (2020/6/4) 0:29 ツイキャスで他人がサポートしてる人って見ることは出来ますか？ (2016/11/28) 11:18 ツイキャスについてです 自分のサポーターは周りから見られるのは知っています 自分がサポートしている人は周りから見れますか？（僕がサポートした人以外） また見れないとしても僕が何人サポートしているかは周りに分かりますか？ (2015/11/21) 17:40 ツイキャスの 公式アプリや公式サイト では、各ユーザーのサポートの一覧が「サポート欄」で確認出来る他、(ログインが必要になりますが) 自分がサポートしているユーザーの一覧も確認する事も可能です。 しかし、他のユーザーがサポートしているユーザーの一覧は、公式のサイトや公式アプリでは確認出来ない仕様になっています。 でも、「誰をサポートしているか」という情報が非公開になっている訳ではなく、公式サイトの情報から全てのユーザーの「サポート欄」をくまなく確認していけば、理論上は「誰が誰をサポートしている」かを調べる事は出来ますが、かなりの時間とデータ量が無駄になるでしょう。 でも、実際は、無料アプリで「誰が誰をサポートしている」の一覧を簡単に確認する事が出来ます。 アンサー 無料Android/iOSアプリの「 キャスポケットツール 」で、他のツイキャスユーザーが...
Read more »

Flutter備忘録: 公開アプリのバンドルIDの更新

イメージ
Google PlayとAppストアで公開しているアプリのバンドルIDを更新しないといけなくなってしまったのですが、その時の工程をここにメモしておきます。 どちらのストアでも、アプリは「バンドルID」で識別されいて、バンドルIDが違うと別のアプリだと認識されます。 また、既存のアプリのバンドルIDを変更する事はどちらのストアでも出来ないらしいので、新しいバンドルIDでアプリを新規登録する必要があります。 バンドルIDは。一度設定したら普通は変更する必要はないのですが、今回はアプリにFirebaseを導入する際に、Firebaseのツールが正しく動作せず、泣く泣くアプリのバンドルIDを変更せざるを得なくなりました。 結論としては、Google Playの場合は至って簡単で、 新しいバンドルIDでアプリを新規で登録した後、古いアプリの設定を更新すれば良かったのですが、Appストアの場合はやり方が悪いとアプリ公開の審査が通らず却下されるみたいで、まず既存のアプリを非公開にしないと新しいアプリは登録出来ない仕様みたいです。 またバンドルID変更に関するApple公式のドキュメントも見つける事もできませんでした。 [目次] GoolgeのPlayストアでバンドルID変更 AppストアでバンドルID変更 結果 GoolgeのPlayストアでバンドルID変更 Playコンソールのサイドバー Google Playの場合は、 新しいバンドルIDでアプリを登録 古いアプリの公開状況を「非公開」に設定 といった工程で、変更が割とスムーズに完了しました。 1. 新しいバンドルIDでアプリを登録 既存のアプリとは別に、新しいAndroidアプリを新しいバンドルIDで作成してPlayコンソールで登録。 ただ、新しいアプリを同じ名前では登録出来ないので、 「...
Read more »

アプリ開発備忘録: ② Android 15からはEdge-to-Edge表示が強制適用に (Part 2)

イメージ
Android 15から画面の「Edge-to-Edge」表示が強制適用になりましたが、この変更に関連した開発コードの備忘録をここにメモしておきます。 パート１ では、Android/Kotlinで実装されたテストアプリを使って、最小限のコード変更として、Android 15以降のデバイスでだけ「Edge-to-Edge」表示が有効になる仕様の画面表示の確認をしました。 パート２ ではAndroid 15よりも前のデバイスでも「Edge-to-Edge」有効にして、なおかつ、ステータスバーの背景色を設定する方法を確認してみます。 [目次] パート 1 Edge-to-Edge表示 (Android アプリ) テストアプリを使って確認 ターゲットSDKバージョンを35に変更 ステータスバーとAppBarが重ならない様にする例 (XMLレイアウト) ※:強制適用されるEdge-to-Edge表示を一時的に無効にする方法 (SDK 35) パート 2 (このメモ) Android15よりも前のデバイスでもEdge-To-Edge表示 ステータスバーの背景色 パート 3 パート２で確認した背景色を設定する方法 別の方法 例: JetPack Compose 例: Flutter 追記 Android15よりも前のデバイスでもEdge-To-Edge表示 ターゲットSDKバージョンが35以降の場合、Android 15以降のデバイスではEdge-to-Edge表示が強制的に有効になります。 逆に、Android 15よりも前のデバイスでは、ターゲットSDKバージョンが35以降の場合、「 enableEdgeToedge() 」というメソッドを使ってEdge-to-Edge表示を有効にしていないと、機種によ...
Read more »