¿Cómo agrego un ícono de edición funcional para una imagen de perfil en Android Studio?

Así que tengo un fragmento que da el diseño para una sección de edición de perfil y tengo una imagen que representa la imagen de perfil de un usuario en particular y quiero agregar de manera eficiente un icono de edición en la esquina inferior derecha de la imagen para que el usuario seleccione, que les permite cambiar una nueva imagen.

Y quiero un poco de ayuda para hacerlo.

fragmento_perfil_configuración.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ProfileSettingFragment">
<de.hdodenhof.circleimageview.CircleImageView
 android:id="@+id/profile_picture_edit"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_centerInParent="true"
 android:src="@drawable/profilepic"
 app:civ_border_color="@color/greyblack"
 app:civ_border_width="4dp"
 app:layout_constraintTop_toTopOf="parent"
 app:layout_constraintStart_toStartOf="parent"
 app:layout_constraintEnd_toEndOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>

En cuanto al código Java, contiene solo los métodos que infla el fragmento.

ProfileSettingFragment.java:

package com.teamrocket.blooddonationcommunity;
import android.os.Bundle;
import androidx.fragment.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class ProfileSettingFragment extends Fragment {
 public ProfileSettingFragment() {
 }
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 }
 @Override
 public View onCreateView(LayoutInflater inflater, ViewGroup container,
  Bundle savedInstanceState) {
 return inflater.inflate(R.layout.fragment_profile_setting, container, false);
 }
}

Marque esto si está duplicado y suelte un enlace.

Solución del problema

Básicamente puedes agregar otro ImageView. Agregue un detector de clics a eso ImageView. Por lo tanto, los usuarios podrán editar la imagen de perfil o agregar una nueva.

Puede actualizar el archivo de diseño de la siguiente manera:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context=".ProfileSettingFragment" >
 <com.google.android.material.imageview.ShapeableImageView
 android:id="@+id/profile_picture"
 android:layout_width="150dp"
 android:layout_height="150dp"
 android:layout_margin="10dp"
 app:layout_constraintEnd_toEndOf="parent"
 app:layout_constraintStart_toStartOf="parent"
 app:layout_constraintTop_toTopOf="parent"
 app:shapeAppearanceOverlay="@style/ImageView.Circle"
 app:srcCompat="@drawable/profile_picture" />
 <ImageView
 android:id="@+id/edit_profile_picture_button"
 android:layout_width="40dp"
 android:layout_height="40dp"
 android:layout_marginEnd="4dp"
 android:layout_marginBottom="4dp"
 android:background="@drawable/bg_circle"
 android:padding="8dp"
 android:src="@drawable/ic_edit_24"
 app:layout_constraintBottom_toBottomOf="@id/profile_picture"
 app:layout_constraintEnd_toEndOf="@id/profile_picture"
 app:tint="@color/white" />
</androidx.constraintlayout.widget.ConstraintLayout>

Con ShapeableImageView, básicamente puede crear una vista de imagen circular sin ningún tercero. Y puede agregar el siguiente estilo a su archivo styles.xml. Así, tu ShapeableImageViewvoluntad será como un círculo.

<style name="ImageView.Circle" parent="">
 <item name="cornerSize">50%</item>
</style>

También agregué bg_circledibujable para hacer un edit_profile_picture_buttoncírculo. Debido a ShapeableImageViewque no es compatible con el relleno, si desea agregar relleno edit_profile_picture_buttonpara una mejor interfaz de usuario. Aquí está el código simple de ese drawablearchivo.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="oval">
 <solid android:color="@android:color/holo_red_dark" />
</shape>

Con ViewBindingo DataBinding, puede interactuar con sus vistas más fácilmente. Estoy dando un ejemplo con ViewBinding, y puedes encontrar más información sobre ellos aquí:

Enlace de visualización: https://developer.android.com/topic/libraries/view-binding

Enlace de datos: https://developer.android.com/topic/libraries/data-binding

Básicamente, agregue esto al nivel de su aplicación (módulo) gradlecomo se muestra en el sitio web del desarrollador.

android {
...
 buildFeatures {
 viewBinding true
 }
}

Y actualice su ProfileSettingFragment:

public class ProfileSettingFragment extends Fragment {
 private FragmentProfileSettingBinding binding;
 @Override
 public View onCreateView(@NonNull LayoutInflater inflater, ViewGroup container,
  Bundle savedInstanceState) {
 binding = FragmentProfileSettingBinding.inflate(inflater);
 return binding.getRoot();
 }
 @Override
 public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
 super.onViewCreated(view, savedInstanceState);
 binding.editProfilePictureButton.setOnClickListener(editProfilePictureButton -> {
 // Update the profile picture or add new one
 });
 }
}