LoginSignup
6

More than 1 year has passed since last update.

Android13のPhoto picker(写真選択ツール)

Last updated at Posted at 2022-08-06

:star2: はじめに

Android 13から以下のような、写真/動画選択時の新しいUIであるPhoto Picker(写真選択ツール)が追加されました。

単一選択 複数選択

公式ドキュメント には startActivityForResult/onActivityResult を使った実装方法しか記載されてなかったので 1registerForActivityResultandroidx.activity の1.6.0-alpha03で追加された ActivityResultContracts.PickVisualMedia / PickMultipleVisualMedia を使った実装方法をやってみました。

:tools: 実装

以下の順で説明していきます。

  1. 依存関係追加
  2. registerForActivityResultを定義
  3. 起動

1. 依存関係追加

ActivityResultContracts.PickVisualMedia 等を使うには、androidx.activity1.6.0-alpha03以降が必要なため追加しておきます。(記事作成時点では 1.6.0-alpha05が最新でした)

build.gradle
dependencies {
    implementation 'androidx.activity:activity-ktx:1.6.0-alpha05'
}

↓から最新版を確認できます。
https://developer.android.com/jetpack/androidx/releases/activity

2. registerForActivityResult の定義

単一選択の場合 :one:

registerForActivityResultの引数に ActivityResultContracts.PickVisualMediaを指定します。
選択した画像のURIが渡ってくるので、それを使って処理を書きます。今回は単純に ImageView にセットする処理を書きました。

private val photoPickerLauncher =
    registerForActivityResult(ActivityResultContracts.PickVisualMedia()) { uri ->
        binding.imageView.setImageURI(uri)
    }

複数選択の場合 :1234:

複数選択の場合は ActivityResultContracts.PickMultipleVisualMediaを指定し、引数に選択できる最大枚数を渡します。(下記の例だと3枚まで選択可)

private val photoPickerLauncher =
    registerForActivityResult(ActivityResultContracts.PickMultipleVisualMedia(3)) { uriList ->
        // 何かしらの処理
}

URIのリストが返ってくるので、それを使って処理を書きます。

3. 起動

起動する時は、 launch の引数に PickVisualMediaRequestを指定します。

PickVisualMediaRequestは引数に VisualMediaTypeをとります。
以下の4つがあるようです。

  • ImageAndVideo
  • ImageOnly
  • SingleMimeType
  • VideoOnly

今回は画像を選択するので ImageOnly を指定しました。

binding.button.setOnClickListener {
    photoPickerLauncher.launch(PickVisualMediaRequest(ActivityResultContracts.PickVisualMedia.ImageOnly))
}

コード全体(単一選択)

MainActivity.kt
class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding
    private val photoPickerLauncher =
        registerForActivityResult(ActivityResultContracts.PickVisualMedia()) { uri ->
            binding.imageView.setImageURI(uri)
        }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = DataBindingUtil.setContentView(this, R.layout.activity_main)

        binding.button.setOnClickListener {
            photoPickerLauncher.launch(PickVisualMediaRequest(ActivityResultContracts.PickVisualMedia.ImageOnly))
        }
    }
}

:movie_camera: 動作イメージ

単一選択

画像を長押ししたらプレビューが表示されるようです。(上記例のワッフルを選択した時)
また、ドキュメントにも以下の記載がある通り、単一選択の場合はハーフスクリーンで開くようです。(上にスワイプしたら全画面になります)

Note: If you choose a maximum of 1, the photo picker opens in half-screen mode.

複数選択

複数選択の場合、PickMultipleVisualMedia()の引数に指定した最大枚数以上を選択しようとするとSnackBarで注意が出てくれるようです。

以上です。

:pencil: 参考

Photo Picker - developer.android.com

ActivityResultContracts.PickVisualMedia - developer.android.com

  1. 2022/08/15 にドキュメントが更新されて、ActivityResultContracts.PickVisualMedia 等を使った実装も追加されてました。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
6