Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to show imageView full screen on imageView click?

I am getting images from url and showing it on the imageView. This functionality is working properly. But I want that when I click on that image, then it must be full screen. So how to achieve this functionality? I know I am missing something. Please help me. Screenshot is attached. I want the same functionality in my app also.

Before clickingAfter clicking

Here is my code, which I am trying on Image click:

    @Override     public void onClick(View v) {         if (isTouch1) {             horizontalScrollView.setVisibility(View.GONE);             isTouch1 = false;             // mSystemUiHider.toggle();             setTheme(R.style.FullscreenTheme);             Log.d("Here isTouch is true", ">");             // ChangeThemeUtils.changeToTheme(FullScreenImageAdapter.this, ChangeThemeUtils.THEME_HIDE_ALL_WINDOW);             getSupportActionBar().hide();          } else {             isTouch1 = true;             horizontalScrollView.setVisibility(View.VISIBLE);             getSupportActionBar().show();             setTheme(R.style.ExampleTheme);             //mSystemUiHider.show();             Log.d("Here isTouch is false", ">");             }     } 
like image 992
Amit Jayaswal Avatar asked Jun 28 '14 04:06

Amit Jayaswal


People also ask

How do I make an image fit in ImageView?

try adding android:scaleType="fitXY" to your ImageView . This will modify the aspect ratio if the original image is not squared. fitXY will almost always change the aspect ratio of the image.

Why is my ImageView not visible?

The Image does not appear at all. If you run the app in Android Api 21 or below, it is a common problem. Mainly, it is because you use high resolution, large dimension images. I recommend you to resize, shrink your images.

How do I resize an image in ImageView to keep the aspect ratio?

However, make sure you're setting the image to the ImageView using android:src="..." rather than android:background="..." . src= makes it scale the image maintaining aspect ratio, but background= makes it scale and distort the image to make it fit exactly to the size of the ImageView.


2 Answers

You can use ImageView below two properties to show image based on your requirement :

  1. android:adjustViewBounds : Set this to true if you want the ImageView to adjust its bounds to preserve the aspect ratio of its drawable.

  2. android:scaleType :Controls how the image should be resized or moved to match the size of this ImageView

    <ImageView     android:id="@+id/imageView"     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:adjustViewBounds="true"     android:src="@drawable/ic_launcher"/> 

Above two properties can be use either xml or java code.

As you need to decide at run time need to show image into full screen or not so will apply above two properties at java code as below :

public class MainActivity extends Activity {      ImageView imageView;      boolean isImageFitToScreen;      @Override     public void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);          imageView = (ImageView) findViewById(R.id.imageView);          imageView.setOnClickListener(new View.OnClickListener() {             @Override             public void onClick(View v) {                 if(isImageFitToScreen) {                     isImageFitToScreen=false;                     imageView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));                     imageView.setAdjustViewBounds(true);                 }else{                     isImageFitToScreen=true;                     imageView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT));                     imageView.setScaleType(ImageView.ScaleType.FIT_XY);                 }             }         });      } } 
like image 84
Haresh Chhelana Avatar answered Sep 20 '22 16:09

Haresh Chhelana


Use Immersive Full-Screen Mode

enter image description here

call fullScreen() on ImageView click.

 public void fullScreen() {          // BEGIN_INCLUDE (get_current_ui_flags)         // The UI options currently enabled are represented by a bitfield.         // getSystemUiVisibility() gives us that bitfield.         int uiOptions = getWindow().getDecorView().getSystemUiVisibility();         int newUiOptions = uiOptions;         // END_INCLUDE (get_current_ui_flags)         // BEGIN_INCLUDE (toggle_ui_flags)         boolean isImmersiveModeEnabled =                 ((uiOptions | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY) == uiOptions);         if (isImmersiveModeEnabled) {             Log.i(TAG, "Turning immersive mode mode off. ");         } else {             Log.i(TAG, "Turning immersive mode mode on.");         }          // Navigation bar hiding:  Backwards compatible to ICS.         if (Build.VERSION.SDK_INT >= 14) {             newUiOptions ^= View.SYSTEM_UI_FLAG_HIDE_NAVIGATION;         }          // Status bar hiding: Backwards compatible to Jellybean         if (Build.VERSION.SDK_INT >= 16) {             newUiOptions ^= View.SYSTEM_UI_FLAG_FULLSCREEN;         }          // Immersive mode: Backward compatible to KitKat.         // Note that this flag doesn't do anything by itself, it only augments the behavior         // of HIDE_NAVIGATION and FLAG_FULLSCREEN.  For the purposes of this sample         // all three flags are being toggled together.         // Note that there are two immersive mode UI flags, one of which is referred to as "sticky".         // Sticky immersive mode differs in that it makes the navigation and status bars         // semi-transparent, and the UI flag does not get cleared when the user interacts with         // the screen.         if (Build.VERSION.SDK_INT >= 18) {             newUiOptions ^= View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY;         }          getWindow().getDecorView().setSystemUiVisibility(newUiOptions);         //END_INCLUDE (set_ui_flags)     } 

Read more

Example Download

like image 27
Mansukh Ahir Avatar answered Sep 22 '22 16:09

Mansukh Ahir