← 一覧へ

やってみよう写真を長押ししてから、ほかの写真も押してみてください

ボタン・操作部品メジャー(よく見る)

選択モード(まとめて選ぶ)

Multi-select Mode

1つを長押しすると選ぶモードに変わり、ほかも押して選べる。上に「3件選択中」、下に「削除」などが出る。

別名複数選択モード一括選択長押しで選択まとめて削除

どこで使われている?

よく見かける場所
スマホの写真アプリ、メールアプリ、ファイルの一覧
使うとよい場面
たくさんの項目に、まとめて同じことをしたいとき
避けたい場面
1つずつしか操作しない一覧

AIへの指示文

これをコピーしてAIに貼り付ければOKです。Webサイトを作る前提の内容です(右上の「何を作る?」で変えられます)。

HTML / CSS / JavaScript で「選択モード(まとめて選ぶ)(Multi-select Mode)」を実装してください。

動き:項目を長押しすると選択モードに切り替え、各項目に丸のチェックを出す。押すたびに選択を切り替え、上に選択中の件数と「すべて選択」、下にまとめてできる操作(削除・共有)を出す。

使う部品:長押し(pointerdown からの時間)で選択モードに切り替え(自作)
もっと詳しく:プログラムでの部品名

同じ動きでも、作るものによってプログラムの中での部品の名前が違います。上の指示文にはすでに入っているので、覚える必要はありません。AIの説明に出てきた単語を確認したいときに使ってください。

Webサイトなら長押し(pointerdown からの時間)で選択モードに切り替え(自作)
iPhoneアプリならList の selection + EditButton
AndroidアプリならcombinedClickable(onLongClick) で自作
FlutterならGestureDetector(onLongPress) で自作
React NativeならPressable(onLongPress) で自作