Quillion
Quillion

Reputation: 6476

Make ImageView fullscreen on click

I have a view with two images

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/top_section"
        android:orientation="vertical"
        android:layout_marginTop="120dp">

    <ImageView
            android:layout_width="match_parent"
            android:layout_height="170dp"
            android:id="@+id/top_image"/>

    <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/top_text"/>
</LinearLayout>

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/bottom_section"
        android:orientation="vertical"
        android:layout_alignParentBottom="true">

    <ImageView
            android:layout_width="match_parent"
            android:layout_height="170dp"
            android:id="@+id/bottom_image"/>

    <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/bottom_text"/>
</LinearLayout>

I would like to make it so that if user clicks image view it becomes full screen and rotates properly to take up full screen.

So far I have tried (for example if top section is clicked)

topText.setVisibility(View.GONE)
bottomSection.setVisibility(View.GONE)
getSupportActionBar().hide();
getActivity().getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);

But image is not really full screen. How would I go about making image full screen? I have been thinking of maybe having one third image view and make that be match parent for width and height and have it become visible on click.

Upvotes: 0

Views: 109

Answers (1)

Marco
Marco

Reputation: 350

Create another activity called ImageZoomedActivity, pass the image data to it through the intent (it could be an url, local file location etc..) and in the OnCreate method :

requestWindowFeature(Window.FEATURE_NO_TITLE);
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
            WindowManager.LayoutParams.FLAG_FULLSCREEN);
    setContentView(R.layout.popup_photo_full);
    supportPostponeEnterTransition();
    if(getIntent().hasExtra("file")) {
        imageFile = new File(getIntent().getStringExtra("file"));
        GlideApp.with(this).asBitmap()
                .load(imageFile)
                .into(image);
        supportStartPostponedEnterTransition();
    }

The code above works with a local file URI passed through the intent.

These two lines

requestWindowFeature(Window.FEATURE_NO_TITLE);
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
            WindowManager.LayoutParams.FLAG_FULLSCREEN);

let you make the activity in full screen. It's possible, also, to make a transition between the first activity with the thumbnail and the second one with the full-screen image. If you want to know more send me a pm, I can send you the detailed code to do that.

Upvotes: 1

Related Questions