Update app.py

app.py

@@ -7,7 +7,7 @@ st.set_page_config(page_title="Image Transformer", page_icon="🖼️", layout="
 
 # Sidebar for navigation and options
 st.sidebar.title("Transformation Options")
-operation = st.sidebar.selectbox(
+operation = st.sidebar.radio(
     "Choose an operation to perform:",
     ("Mirror", "Resize", "Crop", "Rotate", "Black/White", "Pixelate", "Compress")
 )
@@ -22,91 +22,103 @@ uploaded_file = st.file_uploader("Choose an image...", type=["jpg", "png", "jpeg
 if uploaded_file is not None:
     # Load the image
     image = Image.open(uploaded_file)
-    
+
+    # Create two columns for displaying images
+    col1, col2 = st.columns(2)
+
     # Show the original image (smaller size)
-    st.image(image, caption="Original Image", use_column_width=False, width=250)
-
-    # Apply transformations based on the selected operation
-    if operation == "Mirror":
-        st.header("Mirror Image")
-        if st.button("Apply Mirror"):
-            mirrored_image = ImageOps.mirror(image)
-            st.image(mirrored_image, caption="Mirrored Image", use_column_width=False, width=250)
-            
-            # Download button for mirrored image
-            buffered = io.BytesIO()
-            mirrored_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="mirrored_image.png", mime="image/png")
-
-    elif operation == "Resize":
-        st.header("Resize Image")
-        new_width = st.slider("Resize Image - Width", 50, 500, 100)
-        new_height = st.slider("Resize Image - Height", 50, 500, 100)
-        if st.button("Apply Resize"):
-            resized_image = image.resize((new_width, new_height))
-            st.image(resized_image, caption="Resized Image", use_column_width=False, width=250)
-
-            # Download button for resized image
-            buffered = io.BytesIO()
-            resized_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="resized_image.png", mime="image/png")
-
-    elif operation == "Crop":
-        st.header("Crop Image")
-        crop_values = st.slider("Crop Image - (left, upper, right, lower)", 0, 100, (10, 10, 90, 90))
-        if st.button("Apply Crop"):
-            cropped_image = image.crop(crop_values)
-            st.image(cropped_image, caption="Cropped Image", use_column_width=False, width=250)
-
-            # Download button for cropped image
-            buffered = io.BytesIO()
-            cropped_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="cropped_image.png", mime="image/png")
-
-    elif operation == "Rotate":
-        st.header("Rotate Image")
-        angle = st.slider("Rotate Image", 0, 360, 0)
-        if st.button("Apply Rotate"):
-            rotated_image = image.rotate(angle)
-            st.image(rotated_image, caption="Rotated Image", use_column_width=False, width=250)
-
-            # Download button for rotated image
-            buffered = io.BytesIO()
-            rotated_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="rotated_image.png", mime="image/png")
-
-    elif operation == "Black/White":
-        st.header("Convert to Black/White")
-        if st.button("Apply Black/White"):
-            bw_image = image.convert("L")
-            st.image(bw_image, caption="Black & White Image", use_column_width=False, width=250)
-
-            # Download button for black-and-white image
-            buffered = io.BytesIO()
-            bw_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="bw_image.png", mime="image/png")
-
-    elif operation == "Pixelate":
-        st.header("Pixelate Image")
-        pixel_size = st.slider("Pixelate Image", 1, 20, 10)
-        if st.button("Apply Pixelate"):
-            small = image.resize((image.width // pixel_size, image.height // pixel_size), Image.NEAREST)
-            pixelated_image = small.resize((image.width, image.height), Image.NEAREST)
-            st.image(pixelated_image, caption="Pixelated Image", use_column_width=False, width=250)
-
-            # Download button for pixelated image
-            buffered = io.BytesIO()
-            pixelated_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="pixelated_image.png", mime="image/png")
-
-    elif operation == "Compress":
-        st.header("Compress Image")
-        quality = st.slider("Compress Image (Quality)", 10, 100, 80)
-        if st.button("Apply Compress"):
-            compressed_image = image.copy()
-            st.image(compressed_image, caption=f"Compressed Image (Quality: {quality})", use_column_width=False, width=250)
-
-            # Download button for compressed image
-            buffered = io.BytesIO()
-            compressed_image.save(buffered, format="PNG")
-            st.download_button("Download Image", data=buffered.getvalue(), file_name="compressed_image.png", mime="image/png")
+    with col1:
+        st.image(image, caption="Original Image", use_column_width=False, width=250)
+
+    # Apply transformations and show the result in the right column
+    with col2:
+        # Mirror Operation
+        if operation == "Mirror":
+            st.header("Mirrored Image")
+            if st.button("Apply Mirror"):
+                mirrored_image = ImageOps.mirror(image)
+                st.image(mirrored_image, caption="Mirrored Image", use_column_width=False, width=250)
+                
+                # Download button for mirrored image
+                buffered = io.BytesIO()
+                mirrored_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="mirrored_image.png", mime="image/png")
+
+        # Resize Operation
+        elif operation == "Resize":
+            st.header("Resized Image")
+            new_width = st.slider("Resize Image - Width", 50, 500, 100)
+            new_height = st.slider("Resize Image - Height", 50, 500, 100)
+            if st.button("Apply Resize"):
+                resized_image = image.resize((new_width, new_height))
+                st.image(resized_image, caption="Resized Image", use_column_width=False, width=250)
+
+                # Download button for resized image
+                buffered = io.BytesIO()
+                resized_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="resized_image.png", mime="image/png")
+
+        # Crop Operation
+        elif operation == "Crop":
+            st.header("Cropped Image")
+            crop_values = st.slider("Crop Image - (left, upper, right, lower)", 0, 100, (10, 10, 90, 90))
+            if st.button("Apply Crop"):
+                cropped_image = image.crop(crop_values)
+                st.image(cropped_image, caption="Cropped Image", use_column_width=False, width=250)
+
+                # Download button for cropped image
+                buffered = io.BytesIO()
+                cropped_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="cropped_image.png", mime="image/png")
+
+        # Rotate Operation
+        elif operation == "Rotate":
+            st.header("Rotated Image")
+            angle = st.slider("Rotate Image", 0, 360, 0)
+            if st.button("Apply Rotate"):
+                rotated_image = image.rotate(angle)
+                st.image(rotated_image, caption="Rotated Image", use_column_width=False, width=250)
+
+                # Download button for rotated image
+                buffered = io.BytesIO()
+                rotated_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="rotated_image.png", mime="image/png")
+
+        # Black/White Operation
+        elif operation == "Black/White":
+            st.header("Black & White Image")
+            if st.button("Apply Black/White"):
+                bw_image = image.convert("L")
+                st.image(bw_image, caption="Black & White Image", use_column_width=False, width=250)
+
+                # Download button for black-and-white image
+                buffered = io.BytesIO()
+                bw_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="bw_image.png", mime="image/png")
+
+        # Pixelate Operation
+        elif operation == "Pixelate":
+            st.header("Pixelated Image")
+            pixel_size = st.slider("Pixelate Image", 1, 20, 10)
+            if st.button("Apply Pixelate"):
+                small = image.resize((image.width // pixel_size, image.height // pixel_size), Image.NEAREST)
+                pixelated_image = small.resize((image.width, image.height), Image.NEAREST)
+                st.image(pixelated_image, caption="Pixelated Image", use_column_width=False, width=250)
+
+                # Download button for pixelated image
+                buffered = io.BytesIO()
+                pixelated_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="pixelated_image.png", mime="image/png")
+
+        # Compress Operation
+        elif operation == "Compress":
+            st.header("Compressed Image")
+            quality = st.slider("Compress Image (Quality)", 10, 100, 80)
+            if st.button("Apply Compress"):
+                compressed_image = image.copy()
+                st.image(compressed_image, caption=f"Compressed Image (Quality: {quality})", use_column_width=False, width=250)
+
+                # Download button for compressed image
+                buffered = io.BytesIO()
+                compressed_image.save(buffered, format="PNG")
+                st.download_button("Download Image", data=buffered.getvalue(), file_name="compressed_image.png", mime="image/png")