Встроенный инструмент выбора фотографий: более удобный способ конфиденциального запроса фотографий и видео в вашем приложении.
Приготовьтесь улучшить пользовательский опыт вашего приложения с помощью нового захватывающего способа использования средства выбора фотографий в Android! Новое встроенное средство выбора фотографий предлагает удобный и конфиденциальный способ выбора фотографий и видео прямо в интерфейсе вашего приложения. Теперь ваше приложение может получить все те же преимущества, что и встроенное средство выбора фотографий, включая доступ к облачному контенту, интегрированному непосредственно в интерфейс вашего приложения.
Почему именно встроенная функция?
Мы понимаем, что многие приложения стремятся обеспечить пользователям максимально интегрированный и удобный интерфейс при выборе фотографий или видео. Встроенный инструмент выбора фотографий разработан именно для этого, позволяя пользователям быстро получать доступ к своим недавним фотографиям, не покидая приложение. Они также могут просматривать всю свою библиотеку в предпочитаемом облачном хранилище (например, Google Фото), включая избранное, альбомы и функцию поиска. Это избавляет пользователей от необходимости переключаться между приложениями или беспокоиться о том, хранится ли нужная им фотография локально или в облаке.
Бесшовная интеграция, повышенная конфиденциальность
Благодаря встроенному средству выбора фотографий, вашему приложению не требуется доступ к фотографиям или видео пользователя до тех пор, пока он что-либо не выберет. Это означает большую конфиденциальность для ваших пользователей и более удобный интерфейс. Кроме того, встроенное средство выбора фотографий предоставляет пользователям доступ ко всей их облачной медиатеке, в то время как стандартное разрешение на доступ к фотографиям ограничивается только локальными файлами.
Встроенная панель выбора фотографий в Google Сообщениях
В Google Сообщениях демонстрируется мощь встроенного инструмента выбора фотографий. Вот как они его интегрировали:
- Интуитивно понятное расположение: панель выбора фотографий находится прямо под кнопкой камеры, предоставляя пользователям четкий выбор между созданием нового снимка или выбором уже существующего.
- Динамический предварительный просмотр: Сразу после того, как пользователь нажимает на фотографию, он видит увеличенное изображение-превью, что упрощает подтверждение выбора. Если пользователь снимает выделение с фотографии, предварительный просмотр исчезает, обеспечивая удобство и чистоту интерфейса.
- Разверните для просмотра дополнительного контента: начальный вид упрощен и обеспечивает легкий доступ к недавним фотографиям. Однако пользователи могут легко развернуть панель выбора фотографий, чтобы просматривать и выбирать из всех фотографий и видео в своей библиотеке, включая контент из облака Google Фото.
- Уважение к выбору пользователя: встроенный инструмент выбора фотографий предоставляет доступ только к тем конкретным фотографиям или видео, которые выбрал пользователь, что позволяет ему вообще не запрашивать разрешения на доступ к фотографиям и видео. Это также избавляет приложение от необходимости обрабатывать ситуации, когда пользователи предоставляют ограниченный доступ к фотографиям и видео.
Выполнение
Интеграция встроенного средства выбора фотографий упрощается благодаря библиотеке Photo Picker Jetpack .
Композитор Jetpack
Во-первых, добавьте библиотеку Jetpack Photo Picker в качестве зависимости.
implementation("androidx.photopicker:photopicker-compose:1.0.0-alpha01")
Функция EmbeddedPhotoPicker, являющаяся составным элементом, предоставляет механизм для непосредственного включения встроенного интерфейса выбора фотографий в экран создания контента. Этот составной элемент создает SurfaceView, который размещает встроенный интерфейс выбора фотографий. Он управляет подключением к службе EmbeddedPhotoPicker, обрабатывает взаимодействие с пользователем и передает URI выбранных медиафайлов вызывающему приложению.
@Composable
fun EmbeddedPhotoPickerDemo() {
// We keep track of the list of selected attachments
var attachments by remember { mutableStateOf(emptyList<Uri>()) }
val coroutineScope = rememberCoroutineScope()
// We hide the bottom sheet by default but we show it when the user clicks on the button
val scaffoldState = rememberBottomSheetScaffoldState(
bottomSheetState = rememberStandardBottomSheetState(
initialValue = SheetValue.Hidden,
skipHiddenState = false
)
)
// Customize the embedded photo picker
val photoPickerInfo = EmbeddedPhotoPickerFeatureInfo
.Builder()
// Set limit the selection to 5 items
.setMaxSelectionLimit(5)
// Order the items selection (each item will have an index visible in the photo picker)
.setOrderedSelection(true)
// Set the accent color (red in this case, otherwise it follows the device's accent color)
.setAccentColor(0xFF0000)
.build()
// The embedded photo picker state will be stored in this variable
val photoPickerState = rememberEmbeddedPhotoPickerState(
onSelectionComplete = {
coroutineScope.launch {
// Hide the bottom sheet once the user has clicked on the done button inside the picker
scaffoldState.bottomSheetState.hide()
}
},
onUriPermissionGranted = {
// We update our list of attachments with the new Uris granted
attachments += it
},
onUriPermissionRevoked = {
// We update our list of attachments with the Uris revoked
attachments -= it
}
)
SideEffect {
val isExpanded = scaffoldState.bottomSheetState.targetValue == SheetValue.Expanded
// We show/hide the embedded photo picker to match the bottom sheet state
photoPickerState.setCurrentExpanded(isExpanded)
}
BottomSheetScaffold(
topBar = {
TopAppBar(title = { Text("Embedded Photo Picker demo") })
},
scaffoldState = scaffoldState,
sheetPeekHeight = if (scaffoldState.bottomSheetState.isVisible) 400.dp else 0.dp,
sheetContent = {
Column(Modifier.fillMaxWidth()) {
// We render the embedded photo picker inside the bottom sheet
EmbeddedPhotoPicker(
state = photoPickerState,
embeddedPhotoPickerFeatureInfo = photoPickerInfo
)
}
}
) { innerPadding ->
Column(Modifier.padding(innerPadding).fillMaxSize().padding(horizontal = 16.dp)) {
Button(onClick = {
coroutineScope.launch {
// We expand the bottom sheet, which will trigger the embedded picker to be shown
scaffoldState.bottomSheetState.partialExpand()
}
}) {
Text("Open photo picker")
}
LazyVerticalGrid(columns = GridCells.Adaptive(minSize = 64.dp)) {
// We render the image using the Coil library
itemsIndexed(attachments) { index, uri ->
AsyncImage(
model = uri,
contentDescription = "Image ${index + 1}",
contentScale = ContentScale.Crop,
modifier = Modifier.clickable {
coroutineScope.launch {
// When the user clicks on the media from the app's UI, we deselect it
// from the embedded photo picker by calling the method deselectUri
photoPickerState.deselectUri(uri)
}
}
)
}
}
}
}
}
Мнения
Во-первых, добавьте библиотеку Jetpack Photo Picker в качестве зависимости.
implementation("androidx.photopicker:photopicker:1.0.0-alpha01")
Чтобы добавить встроенную панель выбора фотографий, необходимо добавить соответствующую запись в файл макета.
<view class="androidx.photopicker.EmbeddedPhotoPickerView"
android:id="@+id/photopicker"
android:layout_width="match_parent"
android:layout_height="match_parent" />
И инициализируйте его в вашей активности/фрагменте.
// We keep track of the list of selected attachments
private val _attachments = MutableStateFlow(emptyList<Uri>())
val attachments = _attachments.asStateFlow()
private lateinit var picker: EmbeddedPhotoPickerView
private var openSession: EmbeddedPhotoPickerSession? = null
val pickerListener = object EmbeddedPhotoPickerStateChangeListener {
override fun onSessionOpened (newSession: EmbeddedPhotoPickerSession) {
openSession = newSession
}
override fun onSessionError (throwable: Throwable) {}
override fun onUriPermissionGranted(uris: List<Uri>) {
_attachments += uris
}
override fun onUriPermissionRevoked (uris: List<Uri>) {
_attachments -= uris
}
override fun onSelectionComplete() {
// Hide the embedded photo picker as the user is done with the photo/video selection
}
}
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.main_view)
//
// Add the embedded photo picker to a bottom sheet to allow the dragging to display the full photo library
//
picker = findViewById(R.id.photopicker)
picker.addEmbeddedPhotoPickerStateChangeListener(pickerListener)
picker.setEmbeddedPhotoPickerFeatureInfo(
// Set a custom accent color
EmbeddedPhotoPickerFeatureInfo.Builder().setAccentColor(0xFF0000).build()
)
}
Для взаимодействия со встроенным средством выбора фотографий можно вызывать различные методы класса EmbeddedPhotoPickerSession .
// Notify the embedded picker of a configuration change openSession.notifyConfigurationChanged(newConfig) // Update the embedded picker to expand following a user interaction openSession.notifyPhotoPickerExpanded(/* expanded: */ true) // Resize the embedded picker openSession.notifyResized(/* width: */ 512, /* height: */ 256) // Show/hide the embedded picker (after a form has been submitted) openSession.notifyVisibilityChanged(/* visible: */ false) // Remove unselected media from the embedded picker after they have been // unselected from the host app's UI openSession.requestRevokeUriPermission(removedUris)
Важно отметить, что встроенная функция выбора фотографий доступна пользователям Android 14 (уровень API 34) или выше с расширениями SDK 15+. Подробнее о доступности функции выбора фотографий на устройствах можно прочитать здесь .
Для повышения конфиденциальности и безопасности пользователей система отображает встроенное поле выбора фотографий таким образом, чтобы исключить любое отрисовывание или наложение. Это преднамеренное дизайнерское решение означает, что область отображения поля выбора фотографий следует рассматривать как отдельный и выделенный элемент, подобно тому, как вы планируете рекламный баннер.
Если у вас есть какие-либо отзывы или предложения, отправьте заявку в нашу систему отслеживания ошибок .
Автор:
Продолжить чтение
Новости о продуктах
Конфиденциальность и контроль со стороны пользователя остаются в основе работы с Android. Так же, как функция выбора фотографий сделала обмен медиафайлами безопасным и простым, теперь мы обеспечиваем тот же уровень конфиденциальности, простоты и удобства использования для выбора контактов.
Roxanna Aliabadi Walker • 4 мин чтения
Новости о продуктах
Если вы — разработчик Android-приложений, стремящийся внедрить в них инновационные функции искусственного интеллекта, то недавно мы выпустили новые мощные обновления.
Thomas Ezan • 3 мин чтения
Новости о продуктах
Android 17 достиг четвертой бета-версии, последней запланированной бета-версии этого цикла релизов, что является критически важным этапом для обеспечения совместимости приложений и стабильности платформы.
Daniel Galpin • 4 мин чтения
Будьте в курсе событий
Получайте еженедельно самые свежие новости о разработке Android прямо на свою электронную почту.
