Optimize user interface (UI) for enhanced user experience on mobile d…

…evices.
keke125 · May 30, 2023 · 4894b6a · 4894b6a
1 parent c3266a6
commit 4894b6a
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 3 deletions.
diff --git a/src/main/java/com/keke125/pixel/views/generateimage/PixelTransformView.java b/src/main/java/com/keke125/pixel/views/generateimage/PixelTransformView.java
@@ -168,6 +168,7 @@ public PixelTransformView(ImageInfoService imageInfoService, AuthenticatedUser a
                             }
                         } else {
                             Notification.show(String.format(translator.getTranslation("reached-images-size-limit", UI.getCurrent().getLocale()), entry.getKey()));
+                            multiFileUpload.clearFileList();
                             break;
                         }
                     }
@@ -293,6 +294,7 @@ private Component createUploadLayout() {
                             System.out.printf("Tmp File saved to: %s.\n", absolutePath);
                         } else {
                             String errorMessage = String.format(translator.getTranslation("reached-image-size-limit", UI.getCurrent().getLocale()), uploadFileName);
+                            multiFileUpload.clearFileList();
                             Notification notification = Notification.show(errorMessage, 5000,
                                     Notification.Position.BOTTOM_CENTER);
                             notification.addThemeVariants(NotificationVariant.LUMO_ERROR);
@@ -520,6 +522,7 @@ public void beforeLeave(BeforeLeaveEvent beforeLeaveEvent) {
                                 }
                             } else {
                                 Notification.show(String.format(translator.getTranslation("reached-images-size-limit", UI.getCurrent().getLocale()), entry.getKey()));
+                                multiFileUpload.clearFileList();
                                 break;
                             }
                         }

diff --git a/src/main/java/com/keke125/pixel/views/signup/SignupView.java b/src/main/java/com/keke125/pixel/views/signup/SignupView.java
@@ -60,6 +60,7 @@ public class SignupView extends VerticalLayout {
     private final H3 title;
     private final TextField usernameField;
     private final TextField nameField;
+    private final Span avatarLabel;
     private final Upload upload;
     private final MemoryBuffer memoryBuffer;
     private final UploadTCI18N uploadTCI18N;
@@ -108,6 +109,7 @@ public SignupView(AppConfig appConfig, @Autowired UserService service) {
         upload.setMaxFileSize(maxFileSizeInBytes);
         // upload drop label
         dropLabel = new Span(String.format(translator.getTranslation("upload-single-hint", UI.getCurrent().getLocale()), this.appConfig.getMaxAvatarSizeInMegaBytes()));
+        avatarLabel = new Span(String.format(translator.getTranslation("Avatar", UI.getCurrent().getLocale())));
         upload.setDropLabel(dropLabel);
         upload.setReceiver(memoryBuffer);
         // succeed upload
@@ -188,7 +190,7 @@ public SignupView(AppConfig appConfig, @Autowired UserService service) {
         // Create a FormLayout with all our components. The FormLayout doesn't have any
         // logic (validation, etc.), but it allows us to configure Responsiveness from
         // Java code and its defaults looks nicer than just using a VerticalLayout.
-        FormLayout formLayout = new FormLayout(title, usernameField, nameField, upload, passwordField1, passwordField2,
+        FormLayout formLayout = new FormLayout(title, usernameField, nameField, avatarLabel, upload, passwordField1, passwordField2,
                 emailField, errorMessage, submitButton);
 
         // Restrict maximum width and center on page

diff --git a/src/main/resources/translate_en.properties b/src/main/resources/translate_en.properties
@@ -33,8 +33,8 @@ Delete=Delete
 Close=Close
 # views.gallery
 Generated-images=Generated Images
-Image-size=The current total size of the images
-Image-size-limit=The total size limit for the images
+Image-size=Total Image Size
+Image-size-limit=Image Size Limit
 # views.generate-image
 Set-up-transform-parameter=Set up transform parameter
 upload-image-title=Upload images
@@ -61,6 +61,7 @@ discard=Discard
 Sign-up=Sign up
 User-name=Username
 Name=Name
+Avatar=Avatar
 upload-single-hint=Image cannot exceed %dMB in size. Only image file is allowed for upload.
 Email=Email
 Password=Password

diff --git a/src/main/resources/translate_zh.properties b/src/main/resources/translate_zh.properties
@@ -61,6 +61,7 @@ discard=\u6368\u68C4
 Sign-up=\u8A3B\u518A
 User-name=\u4F7F\u7528\u8005\u540D\u7A31
 Name=\u540D\u7A31
+Avatar=\u982D\u50CF
 upload-single-hint=\u6A94\u6848\u5927\u5C0F\u4E0D\u80FD\u8D85\u904E%dMB\uFF0C\u53EA\u80FD\u4E0A\u50B3\u5716\u7247\u6A94
 Email=\u96FB\u5B50\u4FE1\u7BB1
 Password=\u8ACB\u8F38\u5165\u5BC6\u78BC