Not able to draw on top of sticker

[anthonylaurienti]

I cannot seem to draw on top of stickers. When I try to the sticker is moved instead.

Is this the intended behavior? Is there a way to work around this issue?

Thank you.

[anthonylaurienti]

Wondering if there is any update or feedback on this? I'm still having this issue in 1.5.1. @burhanrashid52

[burhanrashid52]

Yes, currently it's not supported because using the just on BrushDrawingView as a first child view. So everything else will be on top of brush view.

[anthonylaurienti]

Is there any desire to change this? I'm currently testing a change where I bring the drawing view to the front while the brush is enabled then sending it back down to the bottom when I'm done drawing (I'll likely add an apply button or something), which works for my needs.

If there is any interest in this feature I'd be happy to contribute my changes.

[burhanrashid52]

Can you share some pseudo code here ? To understand how it works.

[anthonylaurienti]

Sure,

This is the way I believe things are supposed to work (though if I'm wrong feel free to correct me) View height is controlled by a combination of the View's elevation and TranslationZ, where the elevation is the static part and the TranslationZ is dynamic.

A couple of things need to be done in order to move the views around in the Z axis. First, the source image needs to be set lower than any of the views, that way we don't inadvertently put anything behind it. Then we need to have some code that moves the drawing View to the front when the user selects the brush tool and moves it back to the back when the user selects another tool/unselects the brush tool by manipulating the TranslationZ of the drawing View.

What that ends up looking like is something like this.

protected PhotoEditorImpl(Builder builder) {
   .....
   imageView.setTranslationZ(-2);//could be any number below -1 really.
   .....
}
@Override
    public void setBrushDrawingMode(boolean brushDrawingMode) {
        if (drawingView != null) {
            drawingView.enableDrawing(brushDrawingMode);
            if(brushDrawingMode){
                drawingView.setTranslationZ(1);
            }else{
                drawingView.setTranslationZ(-1);
            }
            drawingView.invalidate();
        }
    }

[burhanrashid52]

Okay. I understand that setTranslationZ(1); will help to bring the view front and back. And I think we can achieve the same thing using bringToFront() method on the view.

But the question is, how it will solve the problem ?

Let say if you add a sticker on top of the brush but you want to move the brush above the sticker and set the setTranslationZ(1); this will bring the brush on top but it will also put behind all the other text, sticker and images drawn after the brush.

[anthonylaurienti]

Sorry for the long delay on this.

Take a look at these for some extra info on how Z ordering works. https://developer.android.com/guide/topics/ui/how-android-draws.html https://developer.android.com/reference/android/view/View#Drawing

Bringing the brush to the front with setTranslationZ(1); will effectively raise it above everything currently on the screen, since its Z is now set to 1 instead of 0 like every other view. When the brush tool is no longer selected, we call setTranslationZ(-1); on the drawing view and which lowers it back down below the stickers. The key is to make sure to put the brush back to what we determine the origin ought to be when we no longer have the brush selected.

[burhanrashid52]

I understand the setTranslation effect. But the concern is it will be on top of all other views i.e text, emoji, and images. Let say we draw a line using brush and we've got two text. How do we replace one text below the line and second text above the same line ?

[anthonylaurienti]

I thought the line's drawn were underneath all of the stickers by default anyway, so I'm not sure I'm understanding how the line could be above one view and beneath another?