вы можете использовать Android Studio для этого,
Вот шаги, как этого добиться.
Вы можете сослаться на эту ссылку на использовать ее
1 - Откройте Android Studio, создайте новый проект и дайте ему имя, в нашем случае мы назвали его (ImageZoom), выберите API 16 в качестве минимального SDK, затем выберите пустое действие, нажмите «Готово» и подождите, пока Android Studio создаст ваш проект.
2 - Откройте build.gradle (Модуль: приложение) и добавьте библиотеку PhotoView.
compile 'com.github.chrisbanes: PhotoView: 2.1.3'
3 - Теперь вам нужно открыть build.gradle (Project) и добавить эту строку maven {url "https://jitpack.io"} внутри тега (allprojects).
allprojects {
repositories {
google()
jcenter()
maven { url "https://jitpack.io" }
}
}
4- Синхронизируйте проект, нажав (Синхронизировать сейчас).
файл синхронизации в студии Android
Файл синхронизации синхронизации студии Android. (Большой превью)
5 - Откройте файл activity_main.xml, здесь вы добавите 3 просмотра:
- Android ImageView, который будет держать картинку.
- Android TextView для заголовка и описания изображения.
* * 6- тысяча двадцать восемь
Добавьте Android ImageView и убедитесь, что вы добавили изображение, которое хотите использовать для ImageView, в папку для рисования проекта.
7-:
ImageView
android:id="@+id/ivIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="@drawable/nature" />
8- Добавьте поле над ImageView и поместите его в центр.
<ImageView
android:id="@+id/ivIcon"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
app:srcCompat="@drawable/nature" />
9- Когда вы нажмете на ImageView в окне предварительного просмотра Android Studio, вы увидите пустое пространство сверху и снизу ImageView. Это можно исправить с помощью android: scaleType = "centerCrop", которые позволяют изображению заполнять оставшееся пространство.
<ImageView
android:id="@+id/ivIcon"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:scaleType="centerCrop"
app:srcCompat="@drawable/nature" />
10 - при нажатии на ImageView в окне предварительного просмотра Android Studio вы увидите пустое пространство сверху и снизу ImageView. Вы можете исправить это с помощью android: scaleType = "centerCrop", которые позволяют изображению заполнить оставшееся пространство.
<ImageView
android:id="@+id/ivIcon"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:scaleType="centerCrop"
app:srcCompat="@drawable/nature" />
Когда вы нажмете на ImageView в окне предварительного просмотра Android Studio, вы увидите пустое пространство сверху и снизу ImageView. Вы можете исправить это с помощью android: scaleType = "centerCrop", которые позволяют изображению заполнять оставшееся пространство.
<ImageView
android:id="@+id/ivIcon"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:scaleType="centerCrop"
app:srcCompat="@drawable/nature" />
Добавьте Android TextView, который будет содержать имя изображения, этот TextView будет размещен ниже ImageView (ivIcon) в центре, добавьте немного поля сверху, попробуйте увеличить размер текста до (20sp) и изменить стиль текста на (курсив и полужирный).
<TextView
android:id="@+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_below="@+id/ivIcon"
android:text="@string/flower_name"
android:layout_centerHorizontal="true"
android:textSize="20sp"
android:textStyle="italic|bold" />
11- Теперь вы добавляете окончательный TextView для этого макета, который будет содержать описание изображения, этот TextView будет помещен ниже (tvName), попробуйте увеличить размер текста до (16sp) и не забудьте добавить некоторые поле сверху, чтобы оно не закрывалось с (tvName) TextView.
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tvName"
android:textSize="16sp"
android:layout_marginTop="5dp"
android:text="@string/flower_description" />
12 - Теперь вы закончили работу с файлом activity_main.xml, затем вам нужно открыть файл MainActivity.java и инициализировать Android ImageView и Android AlertDialog.
13 - Инициализация ImageView (ivIcon).
ImageView mIcon = findViewById(R.id.ivIcon);
14 - Далее вам нужно изменить форму ImageView (ivIcon) на окружность, используя RoundedBitmapDrawable и Bitmap.
Bitmap bitmap = BitmapFactory.decodeResource(getResources(),
R.drawable.nature);
RoundedBitmapDrawable mDrawable =
RoundedBitmapDrawableFactory.create(getResources(), bitmap);
mDrawable.setCircular(true);
mIcon.setImageDrawable(mDrawable);
15- Создайте и запустите приложение, чтобы увидеть прогресс.
16 - Теперь вам нужно работать на Android AlertDialog, AlertDialog появится на экране, когда вы попытаетесь нажать на ImageView (ivIcon). Перед тем, как начать, вам сначала нужно создать еще один файл макета, который вы позже будете использовать для AlertDialog
16 - Теперь вам нужно работать на Android AlertDialog, AlertDialog появится на экране, когда вы попытаетесь нажать на ImageView (ivIcon). Перед тем, как начать, вам сначала нужно создать другой файл макета, который вы позже будете использовать для AlertDialog.
17- Создайте новый файл макета и назовите его (dialog_custom_layout.xml), у этого файла будет PhotoView, который будет соответствовать ширине и высоте экрана.
<com.github.chrisbanes.photoview.PhotoView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
18- сейчасвернитесь к файлу MainActivity.java, чтобы иметь возможность нажать на ImageView, вам нужно будет использовать setOnClickListener, а внутри onClick вы создадите AlertDialog.
mIcon.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
AlertDialog.Builder mBuilder = new
AlertDialog.Builder(MainActivity.this);
View mView =
getLayoutInflater().inflate(R.layout.dialog_custom_layout,
null);
PhotoView photoView = mView.findViewById(R.id.imageView);
photoView.setImageResource(R.drawable.nature);
mBuilder.setView(mView);
AlertDialog mDialog = mBuilder.create();
mDialog.show();
}
});
19- Создайте и запустите приложение, чтобы протестировать функцию масштабирования и масштабирования Android.
20 - Хм, кажется, что изображение не заполняет весь AlertDialog! Вы можете исправить это, используя android: scaleType = "centerCrop".
<com.github.chrisbanes.photoview.PhotoView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop" />
21 - Создайте и запустите приложение, чтобы увидеть результат.
22 - Отлично, теперь у вас есть полностью работающее приложение с функцией масштабирования для Android ?
