Android: Switch Height and Width when View change orientation

Question

I do use PhotoView library to ZoomIn-Out. now when user click a button i prepared to rotate the PhotoView, Height and Width would rotate. so width which is smaller than the screen Height. and this result in i can't get the full screen zoom like usual before Rotating the Imageview.

so any solution to make the new width or height after rotation to take full screen.

Example : this is Zoomed Image it doesn't zoom in the entire screen like before the rotation

Could you show how are you rotating the image? Is it a method from the library or the one from `View` class? — cmak, Dec 05 '21 at 01:26

score 1 · Answer 1 · answered Dec 15 '21 at 17:56

I had to work with the same type of feature on my project and here was my design and implementation for it.

Basic XML design for photo view

<?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=".MainActivity">

    <com.github.chrisbanes.photoview.PhotoView
        android:id="@+id/image_main"
        android:layout_width="0dp"
        android:scaleType="centerCrop"
        android:layout_height="400dp"
        android:src="@drawable/gull_portrait_ca_usa"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
    <ImageView
        android:id="@+id/image_rotate"
        android:src="@android:drawable/ic_menu_rotate"
        android:layout_margin="16dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:layout_width="40dp"
        android:layout_height="40dp"/>

</androidx.constraintlayout.widget.ConstraintLayout>

Then I just update the orientation onClick event.

class MainActivity : AppCompatActivity() {
    private lateinit var binding: ActivityMainBinding
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
        binding.imageRotate.setOnClickListener {
            binding.imageMain.rotation = binding.imageMain.rotation+90
        }

    }
}

Output

score 0 · Answer 2 · answered Dec 04 '21 at 18:35

0

You'll need to create 2 xml layout. The portrait (the one you have already created inside res > layout folder) and the landscape (inside res > layout-land).

When you rotate the phone, fragment will load the xml file inside layout-land folder.

You can find a tutorial here: https://www.geeksforgeeks.org/how-to-create-landscape-layout-in-android-studio/

And more info here: https://developer.android.com/guide/topics/resources/providing-resources

answered Dec 04 '21 at 18:35

Filipe Oliveira

850
7
13

Iam not rotating the phone but the imageview itself using imageview.rotateby(); – MiniDev99 Dec 04 '21 at 19:49
i click on the rotate image so it would rotate the imageview itself not the phone, so when the image get rotated height and width would be switched and height would be same as old width – MiniDev99 Dec 04 '21 at 19:50

score 0 · Answer 3 · answered Dec 05 '21 at 01:31

If Image will be rotated, it will adjust in the screen as per his aspect ratio. If you want to fit it to full screen, the image will starched that will not look good. If still you want to do it, simply use the Image as 'background' at the place of 'Image Resources' and keep the view length and width as 'match parent'.

See below sample view:

<ImageView
    android:id="@+id/mainImageID"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/yourImage"/>

Android: Switch Height and Width when View change orientation

3 Answers3