Images
Here we'll inspect FlyCode's image editor
With FlyCode's image editor, your team can unlock the capability of making changes to images that are in the app's code. In addition to editing images, if your app's icons' formats are supported, you'll be able to edit them as well. The supported image formats are:
- apng
- avif
- gif
- jpeg
- jpg
- png
- svg
- webp
This is how the image editor page looks like:
Image editor page
In this example app, we can see there are a few gifs, an image and an svg. We can edit each one by hovering over the image with our cursor and clicking the 3-dots-menu icon:
3 dots menu
As we can see, we can either select to view the image, which will open it in a big display for us to examine, like so:
Preview image
Or we can choose to change it, by uploading a new image. When we choose this option, a pop-up dialog will open and we will see the image. If we click on the image we will be prompted to select a new image to upload; we can also drag-and-drop the new image onto the dialog. Note that we can replace an image only with an image with the same format! The select image dialog looks like this:
Select image dialog
After we replace the image with another, we can click on the replace button:
Image replacement uploaded
Once we click on the "Replace" button, the dialog will close and we will see that the image in the list was changed to our newly uploaded one, and is now in a "Draft" status, pending a change request.
To request this change, click on the "Review Drafts" button at the top right of the page:
Review drafts button
As you can see, there's a number here (in our case a
1) which indicates the number of drafts we have pending. Once we click on the button, a "Review Drafts" dialog will open, where we will be able to review all pending drafts and, if needed, select only the ones we want to request at this time. We can also leave a description of the changes to be displayed in FlyCode's generated Pull Request. The dialog will look like this::
Review changes dialog
Once you're comfortable with your selection, click on the "Request changes" button. The dialog will then close, and the image's status will be changed to "Change requested":
Change requested image
Now all that's left to do is to merge FlyCode's Pull Request, and the changes to the images will be live!
Last modified 3mo ago