- 1. (前編・文法やビルトインの機能中心)数ヵ月くらいDartとFlutterを触ったので個人の所感と学んだことを全体的ににまとめてみる
- 2. 【Flutter】画面タップでキーボードをしまう方法
- 3. Roomで使うkspを導入する際にハマったことと解決した方法
- 4. Android 9以下ではandroid:backgroundで@colorを指定できない件
- 5. 【Kotlin】AndroidアプリへのPush通知機能の実装方法【画像とサンプルコード付き】
- 6. WSL2 環境で Flutter の開発環境を作成する
- 7. Jetpack Composeでテキスト入力欄にPrefix, Suffixを入れる
- 8. Compose改行したテキストとサイズの違うテキストの下部を揃える方法
- 9. Androidでキーボードの表示非表示を検知する【Kotlin】
- 10. Jetpack Composeで相対位置での配置をしたい(ConstraintLayoutのbiasみたいなやつ)
- 11. 【Android】Retrofit2使用時の戻り値の比較 – Call vs Response
- 12. 【AndroidStudio】AndroidGradlePluginのバージョンアップにはアシスタント機能を使うと便利
- 13. Jetpack composeで拡大鏡を実装する
- 14. JetpackComposeのPreviewで知っておくといいことがあるかもしれないTips
- 15. Android Studio JellyfishのGeminiを触ってみる
- 16. [Flutter, VSCode]ワイヤレスデバッグでADB return null value
- 17. a-5-1-1.Realm DBのライブラリの選定と適用(Gradle)
- 18. a-5-1-2(3).Realm DBのデータ保存と更新、削除(配列以外、配列)
- 19. [Android] RecyclerView スクロール時にビViewPagerを非活性化
- 20. Compose Multiplatformで利用できるようになったNavigationを使ってみた
(前編・文法やビルトインの機能中心)数ヵ月くらいDartとFlutterを触ったので個人の所感と学んだことを全体的ににまとめてみる
お仕事で数か月程度DartとFlutterでのスマホアプリ開発をしていたので触ってみて感じた所感や学んだことなど、追加で調べたことなどを雑多に全体的にまとめておきます。
(個人の復習や知識の漏れの補完・その他チームメンバーへの共有も兼ねて)※DartやFlutterの基礎であったり、ビルドインやサードパーティのライブラリ含め利用しているものも全体的に触れていきます。
※色々まとめていたら長くなったので前編後編で分けます。本記事では所感やDart周りなどを中心に触れ、後編はFlutterの細かい点も触れていきます(考えなしに書いていたらとても長くなったのでほぼ自分の勉強用の記事となってきています・・・w)。
# 前置き
:::note warn
専任のアプリクライアントエンジニアやフロントエンジニアなどをやってきているわけではないので専門の方々からすると色々知識が荒い点はご了承ください(仕事でサーバーやクラウドなどを触っている時間なども多めです)。もし専門の方から見て間違いなど気づかれましたらこっそりコメントなどで優し目にマサカリ投げていただけますと幸いです。
:::#
【Flutter】画面タップでキーボードをしまう方法
# はじめに
TextFormFieldを実装した時、キーボードを開く処理は特に必要ありません。
ただ、画面のキーボード以外の部分を触った時に、キーボードをしまう処理は意図的に設定しないといけません。とても簡単なので、真似してみてください。
# 開発環境
[Flutterバージョン]
3.16.1[使用端末]
PC: Macbook Air(M1)[開発ツール]
VSCode# キーボードをしまう処理
対象とするWidgetの親要素に、GestureDetectorを置き、onTapパラメータとbehaviorパラメータに、以下のコードを渡します。
“`dart
GestureDetector(
onTap: () => FocusManager.instance.primaryFocus?.unfocus(),
behavior: HitTestBehavior.opaque,
child: ~画面要素~
)
“`# コード全体
“`dart
class Demo extends StatelessWidget {
Roomで使うkspを導入する際にハマったことと解決した方法
Developersの**Android Kotlin の基礎**のレッスン7までやり終えてやっとアプリが作れると思いきや、まさかのkspのせいでなかなか手こずったので問題そのものと、解決した方法を書きたいと思います。
[Android Kotlin の基礎](https://developer.android.com/courses/kotlin-android-fundamentals/overview?hl=ja)
※ 因みにこのコースを受講するきっかけの記事と、このコースを受講する際に参考にした記事も貼っておきます。
・[受講するきっかけの記事](https://qiita.com/yayamochi/items/7c689fd7fe6954e3c198)
・[参考にした記事](https://note.com/haine_rion23/)
参考に記事の方はコースごとに丁寧に解説していてとてもわかりやすかったのでおすすめ。# 本題
android studioでroomを使おうとして公式のドキュメント通りに追加したらエラーが出たので、
色々と試したものと、最終的に解決し
Android 9以下ではandroid:backgroundで@colorを指定できない件
タイトルの通り、Viewの背景にべた塗りの色を指定したくて、以下のように指定しました
“`xml
“`結果、Android9以下で
“`
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.example/com.example.MainActivity}: android.view.InflateException: Binary XML file line #21: Binary XML file line #21: Error inflating class TextView
…
Caused by: android.view.Inf
【Kotlin】AndroidアプリへのPush通知機能の実装方法【画像とサンプルコード付き】
# はじめに
アプリには必須と言えるPush通知ですが、いざ実装しようとすると色々と複雑そうでよくわからない…
そんな人に向けた記事となっています。
はじめにFirebase Cloud Messaging(FCM)を利用したPush通知の実装手順を記載した後で、Push通知ASPの[Appvisor](https://mb.app-visor.com/ “Appvisor”)を利用した手順や実際の配信の流れを説明していきます。# Push通知実装までの流れ
1. ベースとなるAndroidアプリの実装
1. Firebaseコンソール上でFirebaseプロジェクトを作成
1. AndroidアプリでFirebaseのサービスを実装
1. フォアグラウンド時の通知表示の実装# 動作環境
– Android Studio Jellyfish | 2023.3.1
– Android Gradle Plugin Version 8.4.0
– Gradle Version 8.6
– Mac OS Sonoma 14.4.1
– Android 14※Push通知の動作検
WSL2 環境で Flutter の開発環境を作成する
# Flutterとは
Flutterは、単一のコードで複数のプラットフォーム上で動作可能なアプリケーションが作成可能なオープンソースフレームワークです。執筆時点でiOS・Android・Windows・macOS・Linux・Webのアプリケーションが作成可能です。
->[公式サイト](https://flutter.dev/)# 環境と前提
– Windows 11 Pro 23H2
– WSL2 (Ubuntu 22.04)本来は[公式のインストール手順](https://docs.flutter.dev/get-started/install/linux/android)に沿って作業をするのが一番ですが、今回は「Windows環境を汚さない」「WSLのコマンドラインで完結する」を目指して手順を再構成しています。
本記事のゴールは「WSL環境で開発したFlutterアプリをAndroidスマホ実機で(デバッグモードで)起動する」ところまでです。
なお、今回はAndroid Studio のエディタおよびAndroid エミュレータの環境構築は対象としません。
また、W
Jetpack Composeでテキスト入力欄にPrefix, Suffixを入れる
# 本文
主にAndroid開発でKotlinのJetpack Composeで入力欄にprefix, suffixを付ける方法。
たとえば、金額入力欄に
「料金1000円」
と入力させたいときに、ユーザーには数値のみを入力させ、最初の「料金」(prefix)と最後の「円」(suffix)を自動で付加できる。“`FormText.kt
OutlinedTextField(
visualTransformation = PreSuffixTransformer(“料金”, “円”),
label = {
Text(“お会計”)
},
)class PreSuffixTransformer(val prefix: String = “”, val suffix: String = “”) : VisualTransformation {
override fun filter(text: AnnotatedString): TransformedText {
val result = AnnotatedString(
Compose改行したテキストとサイズの違うテキストの下部を揃える方法
Compose改行したテキストとサイズの違うテキストの下部を揃える方法です。
実装サンプル画像
![スクリーンショット 2024-05-12 19.24.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/274615/094f0100-da3f-c300-3ed5-f1fadce5d961.png)“`TextSample.kt
@Composable
fun TextSample() {
Row {
Text(
text = “取得”,
modifier = Modifier.alignByBaseline(),
maxLines = 1,
fontSize = 20.sp
)
Text(
text = “1000”,
modifier = Modifier.alignByBaseline(
Androidでキーボードの表示非表示を検知する【Kotlin】
# 準備
https://github.com/yshrsmz/KeyboardVisibilityEvent
こちらのライブラリを使ってソフトキーボードの表示中を検知します。
↑を元に準備していきます。
“`php:build.gradle(:app)
dependencies {
api ‘net.yslibrary.keyboardvisibilityevent:keyboardvisibilityevent:2.1.0’
}
“`# 実践
“`php:MainActivity.kt
KeyboardVisibilityEvent.setEventListener(this) {
KeyboardVisibilityEventListener {
if (it) {
// 表示
} else {
// 非表示
}
}
Jetpack Composeで相対位置での配置をしたい(ConstraintLayoutのbiasみたいなやつ)
# 概要
中央に置きたいだけならAlignment.Centerで良いのだが**ConstraintLayoutでいうところのこの辺と同じ様に相対位置で要素を配置したい**という課題について調べた際の備忘録です。
– layout_constraintVertical_bias
– layout_constraintHorizontal_bias# 結論
`BiasAlignment`を使えば良い。
縦横ともに0fが中央になり、-1f〜1fの範囲内で指定する。“`kotlin
@Composable
fun BiasAlignmentSample() {
Box(
modifier = Modifier.fillMaxSize(),
contentAlignment = BiasAlignment(
horizontalBias = -0.8f,
verticalBias = 0.7f
)
) {
Text(“Sample”)
}
}@Preview(
showBackground = true,
【Android】Retrofit2使用時の戻り値の比較 – Call vs Response
# Retrofit2の戻り値
戻り値の型として、以下の2つを想定し比較する
– Call\
– Response\## APIの実行
### Call\を使用する場合
APIの実行はCall\クラスの以下のメソッドを使用することになる
– Call#execute()
– 非同期処理
– Call#enqueue()
– 同期処理### Response\
を使用する場合
APIの実行は、APIの実行メソッドを呼び出すだけ
– APIの実行メソッドをsuspendメソッドにすることで非同期処理になる## APIの結果の受け取り
– Call#excecute()を使用
– Call#excecute()の戻り値であるResponseから行う
– Call#enqueue()を使用
– #enqueue()の引数Callbackのcallbackメソッドから行う
– Response\を使用
– 戻り値であるResponseから行う ## 結論
– Response\を使用す
【AndroidStudio】AndroidGradlePluginのバージョンアップにはアシスタント機能を使うと便利
# はじめに
以前ご紹介した[SDKアップデート時に利用できるアシスタント機能](https://qiita.com/YuukiYoshida/items/bf3e9cd20b658c24fb6e)など、最近AndroidStudioがどんどん便利になっていますが、今回はAndroidGradlePluginのバージョンをアップデート時に利用すると便利なアシスタント機能をまとめてみようと思います。# AGP Upgrade Assistant
正式名称はタイトルの通りになりますが、こちらはAndroid Studio 4.2から追加された機能になります。
これまでは【AGPとGradleのバージョンを変更】→【Sync Gradle Files】→【エラーやワーニングの指摘箇所を修正】→【Sync Gradle Files】→と何度も確認する必要があり大変でしたが、アシスタント機能を利用することで簡単にバージョンアップが行えるようになりました。![スクリーンショット 2024-05-12 11.59.58.png](https://qiita-image-store.s3.ap
Jetpack composeで拡大鏡を実装する
# 初めに
今回はJetpackComposeを使って拡大鏡を実装していきます
### 本文
やること自体は至極単純で下記をModifierに設定するのみです
“`kotlin
var offset by remember {
mutableStateOf(Offset.Zero)
}
Modifier.magnifier(sourceCenter = {
offset
}
“`
ただし、`@OptIn(ExperimentalFoundationApi::class)`アノテーションを付けないといけないので注意してください### さいごに
今回はJetpackComposeでの拡大鏡実装方法を紹介しました
どなたかのお役に立てれば幸いです
JetpackComposeのPreviewで知っておくといいことがあるかもしれないTips
## はじめに
2023年3月からAndroidアプリエンジニアをしている KSND([GitHub](https://github.com/kosenda)、[X](https://twitter.com/ksnd_dev) )といいます。最近LTしてみたいな〜と漠然に思っていて、PreviewについてLTしたら面白いのではと考えちょっとだけPreviewについて調べましたが大して話せそうなことがなかったのでLTを断念しました。
すぐに忘れてしまいそうだったので思い出せるようにこの記事を書きました。今後、Preview関連でTipsを知ったらこの記事に追記しようと思ってます。
## Previewでダミーのテキストを使いたい時
Composeのライブラリ(`androidx.compose.ui:ui-tooling-preview`)で用意されている`LoremIpsum`(ロレムイプサム)というクラスを利用すれば自前でダミーテキストを用意しなくても良くなります。
– Android developers – LoremIpsum
https://develope
Android Studio JellyfishのGeminiを触ってみる
Android Studio Jellyfishの安定版がリリースされ、Geminiが標準搭載されたようなので触ってみました。
どんなことができるのか把握するためのただの自分用メモです。## 使ってみる
[こちら](https://developer.android.com/studio/preview/gemini?hl=ja)を参考にセットアップできます。
使用する際には、自分のプロジェクトを参照するか選べるようになっています。プロダクトに使う場合は参照させないようにした方が良いでしょう。
![スクリーンショット 2024-05-11 12.25.44(2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724617/9c20133a-cda8-8b0a-5477-d62c9daae8c5.png)
コードを書かせたら、コードブロックの下にそのコードに関するオプションが出てきます。
![スクリーンショット 2024-05-11 12.42.18(2).png](https://qii
[Flutter, VSCode]ワイヤレスデバッグでADB return null value
# 環境
VSCodeの拡張機能”ADB Interface for VSCode”(v0.22.4)を使用してAndroidに接続しワイヤレスデバッグをしています。
# 問題
deviceのIP addressとPortを入力すると”ADB return null value”というメッセージがVSCodeの通知欄に出力され、デバッグができるdevice listに追加されない問題がおこりました。
![ADB_return_null.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1655458/24f656a3-8e80-cc18-227a-558888b4d258.png)
# 対処法
VSCodeで“`Cmd + Shift + p“`を押して“`Kill ADB server“`を選択します。
![スクリーンショット 2024-05-10 18.37.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1
a-5-1-1.Realm DBのライブラリの選定と適用(Gradle)
### a-5-1-1.Realm DBのライブラリの選定と適用(Gradle)
#### 目標設定
[一覧に戻る](https://qiita.com/ryouta33/items/57f5e51a26086151a0da)#### Github
https://github.com/wakizaka24/AndroidTest
#### テスト実装
“`gradle:build.gradle
buildscript {
repositories {
google()
}
dependencies {
def nav_version = “2.5.3”
classpath “androidx.navigation:navigation-safe-args-gradle-plugin:$nav_version”
}
}plugins {
id ‘com.android.application’ version ‘8.0.2’ apply false
id ‘com.andr
a-5-1-2(3).Realm DBのデータ保存と更新、削除(配列以外、配列)
### a-5-1-2(3).Realm DBのデータ保存と更新、削除(配列以外、配列)
#### 目標設定
[一覧に戻る](https://qiita.com/ryouta33/items/57f5e51a26086151a0da)#### Github
https://github.com/wakizaka24/AndroidTest
#### テスト実装
“`kotlin:RealmTestActivity.kt
package com.example.androidtestimport android.os.Bundle
import android.util.Log
import androidx.appcompat.app.AlertDialog
import androidx.appcompat.app.AppCompatActivity
import com.example.androidtest.databinding.ActivityRealmTestBinding
import io.realm.kotlin.ext.query
import k
[Android] RecyclerView スクロール時にビViewPagerを非活性化
![](https://velog.velcdn.com/images/rmsxo5678/post/a5707960-d1d6-4e34-b65a-1c4c72610b53/image.gif)
# *ViewPager非活性化*ViewPagerに 特定のRecyclerViewがある部分で他のタブに移動しないように、ViewPagerの動きを無効にする必要がありました。
そのサンプルコードは“`メインアクティビティ内でリサイクラービューをフラグメントに実装したが“`
“`フラグメント内のフラグメントはIncludeで表現されている “`ViewPagerがタッチされると、そのタッチイベントのx、y座標を取得し、その座標が特定のRecyclerViewの領域内にあるかを確認して、ViewPagerの機能を無効にし、タッチが終了したらスワイプ機能を再度有効にするようにGitHubにコメントで記載していましたが、
サンプルではアクティビティでViewPagerのインターフェイスを設定し、onScrollメソッドが呼ばれるかどうかを決定し、リサイクラービューがスクロー
Compose Multiplatformで利用できるようになったNavigationを使ってみた
## はじめに
[Compose Multiplatform](https://www.jetbrains.com/ja-jp/lp/compose-multiplatform/)は、[Jetpack Compose](https://developer.android.com/develop/ui/compose/) をベースにKMP(Kotlin Multiplatform)プロジェクトでUIを構築するためのフレームワークです。
ここ最近は、目まぐるしいスピードで進化をしており、Resource周りも共通で実装できるようになっています!
そして、alpha版ではありますが、ついに `Navigation` も利用できるようになりました🎉実際に `Navigation` を利用したところ体験が良かったため、本記事で紹介します!
## Navigationとは?
[Navigation](https://developer.android.com/guide/navigation)は、アプリ内の様々なコンテンツ間を遷移するためのAndroidでのライブラリです。
このライブラ