burhanrashid52 / PhotoEditor

A Photo Editor library with simple, easy support for image editing using paints,text,filters,emoji and Sticker like stories.
MIT License
4.16k stars 992 forks source link

[Bug or misunderstanding] Usage of Plugin #392

Closed red-game-dev closed 2 years ago

red-game-dev commented 3 years ago

Describe the bug Trying to invoke ja.burhanrashid52.photoeditor.PhotoEditor.Builder but nothing is being shown, yet other methods works and shows something, such as addImage. How do I properly set it up?

I tried as well through new java app for testing, same result, while using concurrent version.

Further information where i am using this

This is not pure Java, I'm using Nativescript, which allows us to use native java & swift on JS (https://nativescript.org/), mostly same as Flutter, React-Native, Ionic, Cordova. In this case doesn't require any bridges, so we can just add the plugin on Gradle, invoke it and start work with it, although a proper typing's is good to be in place for better readability and intellisense. Through the reproduce you may see code quite familiar to java, but instead is calling the full namepsace usually.

You don't need really to invoke this within the an NS app, if I've a proper demo to work with, this could be very helpful. As well, with such amazing plugin, it would be nice later to see it being used in flutter, react-native, nativescript and others.

To Reproduce

  1. Add the code in NS main app.vue component

           // Get the native view invoked instance
            const nativeView =
              new ja.burhanrashid52.photoeditor.PhotoEditorView(
                Application.android.context,
              );
            // Create image editor
            const mPhotoEditor =
              new ja.burhanrashid52.photoeditor.PhotoEditor.Builder(
                Application.android.context,  // relevant to this in Activity class
                nativeView, // ja.burhanrashid52.photoeditor.PhotoEditorView invoked class
              )
                .setPinchTextScalable(java.lang.Boolean.parseBoolean("true"))
                .setClipSourceImage(java.lang.Boolean.parseBoolean("true"))
                .build();
    
            mPhotoEditor.undo();
            mPhotoEditor.redo();
    
            // Append
            this.$refs.appPage.nativeView
              .getViewById("viewEditFrame")
              .nativeView.addView(nativeView);
    
            console.dir(mPhotoEditor);
    
            // Add image example to see if is working
            mPhotoEditor.addImage(imageSource.android);

Console.dir log

JS: ==== object dump start ====
JS: constructor()
JS: addEmoji()
JS: addImage()
JS: addText()
JS: brushEraser()
JS: clearAllViews()
JS: clearHelperBox()
JS: editText()
JS: getBrushColor()
JS: getBrushDrawableMode()
JS: getBrushSize()
JS: getEraserSize()
JS: isCacheEmpty()
JS: redo()
JS: saveAsBitmap()
JS: saveAsFile()
JS: setBrushColor()
JS: setBrushDrawingMode()
JS: setBrushEraserSize()
JS: setBrushSize()
JS: setFilterEffect()
JS: setOnPhotoEditorListener()
JS: setOpacity()
JS: setShape()
JS: undo()
JS: to()
JS: <init>()
JS: clone()
JS: equals()
JS: finalize()
JS: getClass()
JS: hashCode()
JS: notify()
JS: notifyAll()
JS: toString()
JS: wait()
JS: ==== object dump end ====
  1. Try using it, and will do nothing on invoking.

Expected behavior The edit layout to show on the view, with the required tools upon invoking the class ja.burhanrashid52.photoeditor.PhotoEditor.Builder and built.

Screenshots/Video/GIFs image

Smartphone Info:

Am I doing something wrong? Perhaps I do need invoke something else after? I've checked the docs and went through it step by step. A demo of how to use it would be very helpful, can be in Java as well!

Looking forward to hearing from you.

Best regards, Cheers

burhanrashid52 commented 3 years ago

This is interesting. I've not tested this with cross-platform plugins. You are saving addImage works. So I did not understand the exact issue. What do you mean by setting it properly ? It will work only when it is set properly.

red-game-dev commented 3 years ago

Hi @burhanrashid52 !

Yes, indeed it is, in fact it would be helpful, since it would possible that we could as well later release it as plugin based from this plugin as native (would include as well iOS with some other plugin, I believe). But for the time being, which just need it for ourselves, as there is no need for separating the logic.

What I'm trying to achieve in here is to have the following UI in the image below, how do I call that view from? From what I read it seems that this UI is under the class of ja.burhanrashid52.photoeditor.PhotoEditorView, yet wasn't able to invoke it to make it show, even by inject the view into the native elements (findViewById or Frame and add the View).

image

Are there any methods that can allow me to invoke this, something like .show(...), .hide(...)? The console.dir section part doesn't show any methods that I could possibly utilize in this case seems. Which is why, I was asking if there is any demo that I could possibly take an idea from, how I can invoke and use the plugin properly :)

Looking forward to hearing from you.

Best regards, Cheers

burhanrashid52 commented 3 years ago

The only sample demo I've for now is EditImageActivity in app module. If you are inserting PhotoEditorView in native using js then make sure it has some height and width define or have match_parent.

FranTar1991 commented 3 years ago

I think this is a misunderstanding, I also had the same problem. I thought that just by building the PhotoEditor will be good to go but it turns out that you have to implement all of the functions, you can see this in the example app called Photo Editor, clone the project and you´ll see.

github-actions[bot] commented 2 years ago

This issue is stale because it has been open 20 days with no activity. Remove stale label or comment or this will be closed in 4 days.

github-actions[bot] commented 2 years ago

This issue was closed because it has been stalled for 5 days with no activity.