Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Photo editor module refactor #11

Merged
merged 15 commits into from
Aug 2, 2019

Conversation

mzorz
Copy link
Contributor

@mzorz mzorz commented Jul 31, 2019

Addresses #7

This refactor organizes things in a better way by doing some renames and bringing a new package structure:

Screen Shot 2019-08-02 at 09 28 38

The com.automattic.photoeditor.views package now contains all related files for:

  • PhotoEditorView. This is the main view, where all the action happens.
  • .views.brush. This one contains all classes related to free form drawing
  • .views.filter. This package contains all classes that are needed to apply filters on top of the background image. Filters are only applicable to static background images.
  • views.background. Background can be either
    • fixed (static image implemented by BackgroundImageView or static image with filters applied on top with FilterImageView) or
    • video (either pre-recorded video or camera preview mode). The latter is implemented by a TextureView.
  • .views.added contain the helper classes that hold information about all other Views the user is able to add (TextView which is used for Text and emoji), and ImageView for animated / static stickers).

This PR also introduces a new class BackgroundSurfaceManager. The state changes are consumed by this specialized class which is a LifecycleObserver https://developer.android.com/topic/libraries/architecture/lifecycle (also see https://github.com/googlesamples/android-architecture-components for samples)

I think this new way makes things clearer, and the new class encapsulates the switching of the background view from static / video playing / camera preview modes in an efficient way.

To test:
For testing, I've added 3 options on the overflow menu:

  • Camera preview
  • Static bkg
  • Play video

Screen Shot 2019-08-02 at 09 36 04

The first one will request permissions as needed, and will render the camera preview as a background. You should still be able to use the normal added views (brush, emoji, text) normally, while having the camera preview as a background.
The second one switches back to the static background (orange background for now).
The third one makes the background SurfaceTexture visible, ready for video to be played.

Also note that the static background can't be changed (it's just the orange shapes for now), and the third option only makes the right surface available, but no videos are played at the moment, as this PR cares only about being able to manage and switch background surfaces as per #7. What this means is, if you use the camera preview first, then switching to "Video player" mode will show the last buffered still image from the camera preview (that's what the underlying TextureSurface contains). If you try it before testing camera preview, a blank canvas will be shown.

Notes:

@mzorz mzorz changed the base branch from app/foundation-photo-editor-lib-module to app/foundation August 1, 2019 15:52
@mzorz mzorz marked this pull request as ready for review August 2, 2019 12:39
@mzorz mzorz requested a review from aforcier August 2, 2019 12:39
@aforcier aforcier self-assigned this Aug 2, 2019
@aforcier aforcier added this to the Demo 1: Basic Creation milestone Aug 2, 2019
@@ -39,7 +39,10 @@ internal class TextureRenderer {

fun init() {
// Create program
mProgram = GLToolbox.createProgram(VERTEX_SHADER, FRAGMENT_SHADER)
mProgram = GLToolbox.createProgram(
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Noticed there are a few m prefixes around the photoeditor lib, opened an issue to track cleaning this up (not necessary to do in this PR): #17.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🙇 good call

@@ -130,8 +137,12 @@ class PhotoEditorView : RelativeLayout {
ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT
)
brushParam.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE)
brushParam.addRule(RelativeLayout.ALIGN_TOP, imgSrcId)
brushParam.addRule(RelativeLayout.ALIGN_BOTTOM, imgSrcId)
brushParam.addRule(RelativeLayout.ALIGN_TOP,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mzorz looks like some autoformatting happened here (and below) that's a bit weird, any idea what happened?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🤔 no idea actually 🤷‍♂ - fixed in 3233472

@aforcier
Copy link
Collaborator

aforcier commented Aug 2, 2019

Looks good @mzorz ! Things feel a lot neater with this structure 💯

Nice use of the LifecycleObserver. I noticed the various @LifecycleEvent-annotated methods in BackgroundSurfaceManager are marked by the IDE as unused - perhaps they'll add tooling around that at some point, it's a bit odd.

@aforcier
Copy link
Collaborator

aforcier commented Aug 2, 2019

:shipit:

@aforcier aforcier merged commit 0708d3c into app/foundation Aug 2, 2019
@aforcier aforcier deleted the app/foundation-photo-editor-refactor branch August 2, 2019 13:44
@mzorz mzorz mentioned this pull request Aug 2, 2019
1 task
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants