3

Well, I want to create a simple app. that reverse the look of the layout, even if the widget is DigitalClock or something else. I've tried it with the android:scaleX="-1"; but it works only on text and images.

How can I create a layout that reversed the whole screen, to look like a mirrored view?

thanks ahead.

normal view:

normal view the view I want:

the view I want

Oren Zakay
  • 519
  • 8
  • 17

1 Answers1

5

Just make a custom ViewGroup (or extend an existing one) and scale the canvas before it draws its children:

public class MirrorRelativeLayout extends RelativeLayout {
    public MirrorRelativeLayout(Context context) {
        super(context);
    }

    public MirrorRelativeLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MirrorRelativeLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void dispatchDraw(Canvas canvas) {
        canvas.save();
        // Scale the canvas in reverse in the x-direction, pivoting on
        // the center of the view
        canvas.scale(-1f, 1f, getWidth() / 2f, getHeight() / 2f);
        super.dispatchDraw(canvas);
        canvas.restore();
    }

    @Override
    public void draw(Canvas canvas) {
        canvas.save();
        // Scale the canvas in reverse in the x-direction, pivoting on
        // the center of the view
        canvas.scale(-1f, 1f, getWidth() / 2f, getHeight() / 2f);
        super.dispatchDraw(canvas);
        canvas.restore();
    }
}

Then just use that ViewGroup as the root of your layout:

<com.your.packagename.MirrorRelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:text="Mirror Text!"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</com.your.packagename.MirrorRelativeLayout>
Kevin Coppock
  • 133,643
  • 45
  • 263
  • 274