今まで約10年iOSアプリ開発を主にやっていたのですが最近はAndroidアプリ開発に挑戦しています。
Jetpack ComposeとCoilで通信処理を利用した画像表示をするコード
@Composable
fun ImageListItem(index: Int) {
val imageUrl = "https://developer.android.com/images/brand/Android_Robot.png"
Row(verticalAlignment = Alignment.CenterVertically) {
Image(
painter = rememberImagePainter(imageUrl),
contentDescription = "Android Logo",
modifier = Modifier.size(50.dp)
)
Spacer(modifier = Modifier.width(10.dp))
Text(
text = "Item #$index",
style = MaterialTheme.typography.subtitle1
)
}
}
しかし
こんな感じで単純なComposableを書いてみたのですが、なぜか画像が表示されません。
AndroidManifest.xmlでもしっかり権限をつけているはずなんですが。
<uses-permission android:name="android.permission.INTERNET" />
そこでログを確認できるようにコードを変更して再度実行。
@Composable
fun ImageListItem(index: Int) {
val imageUrl = "https://developer.android.com/images/brand/Android_Robot.png"
val painter = rememberImagePainter(imageUrl)
Row(verticalAlignment = Alignment.CenterVertically) {
Image(
painter = painter,
contentDescription = "Android Logo",
modifier = Modifier.size(50.dp)
)
Spacer(modifier = Modifier.width(10.dp))
Text(
text = "Item #$index",
style = MaterialTheme.typography.subtitle1
)
}
Log.d("TEST", "${painter.state}")
}
するとこんなエラーログが出力されました。
D/TEST: Error(painter=null,
..(省略)..
throwable=java.net.SocketException: socket failed: EPERM (Operation not permitted)))
権限の問題?AndroidManifestにはちゃんと書いてるのに何か他にも権限が足りないのか、、、
しかし調べてみると、なんと一度アンインストールして再度インストールすると解決するという、、、
ということなのでシミュレーターからアプリを削除
再度ビルドして起動してみると
表示されました。
終わりに
こういう問題に遭遇するのは結構初歩的なAndroid開発あるあるなんですかね?
エラーログはこんな適当な書き方で通信の非同期処理のログを出力できてしまうなんてちょっと頭がこんがらがりそうですが、基本的にはJetpack Composeはシンプルにコードを書くことができて便利で楽しいです。