How To Make Drag out from zoom out of image go away?

Question

This is My Xml Code

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".ImageViewer">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#32000000">
    <android.support.v7.widget.Toolbar
        android:id="@+id/tabLayout"

        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>

<!-- The primary full-screen view. This can be replaced with whatever view
     is needed to present your content, e.g. VideoView, SurfaceView,
     TextureView, etc. -->
<com.github.chrisbanes.photoview.PhotoView
    android:id="@+id/Zoomage_Image"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

And This is My Java Code

ImageView zoomage=findViewById(R.id.Zoomage_Image);
    Intent i=getIntent();
    String imageuri=i.getStringExtra("imageurl");
    Log.d(TAG, "onCreate: "+imageuri);
    Picasso.get().load(Uri.parse(imageuri)).into(zoomage);

The Zoom In Works Perfectly fine but whenever i zoom out the image leaves ugly looking drags on Screen How do i make those drag marks go out and not display.

on Some devices this drag out doesn't display while on some devices this seems very ugly.

ScreenShot

While you're on it also help me with how to add appbar layout such that it is translucent as well as provides up navigation when clicked on back button.

Answer 1

Instead of the library you are using try this with custom Animation and you can change any value you want as per your requirement:

Run this on your onClick:

zoom_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="true" >
    <scale
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXScale="1"
    android:fromYScale="1"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="3"
    android:toYScale="3" >
    </scale>
 </set>

zoom_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="true" >
    <scale
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXScale="1.0"
    android:fromYScale="1.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="0.5"
    android:toYScale="0.5" >
    </scale>
 </set>

Alternatively, for better understanding Try code samples by Google with Zoom Animator

Enlarge a view using a zoom animation