Update README with Sprite Flipper tool information

This commit is contained in:
2026-05-05 12:51:34 +08:00
parent 34eaaf406d
commit 86f977c2c9
2 changed files with 64 additions and 6 deletions

View File

@@ -6,7 +6,7 @@
## 🎯 功能概述 ## 🎯 功能概述
SpriteTool 是一個整合式的 Web 應用程式,集合了個專業級工具於一身: SpriteTool 是一個整合式的 Web 應用程式,集合了個專業級工具於一身:
### 📏 Grid Tool網格工具 ### 📏 Grid Tool網格工具
用於在圖片上定義規則的網格區域並進行批量選取。 用於在圖片上定義規則的網格區域並進行批量選取。
@@ -55,6 +55,20 @@ SpriteTool 是一個整合式的 Web 應用程式,集合了三個專業級工
--- ---
### 🔄 Sprite Flipper精靈翻轉工具
快速對 Sprite Sheet 中的每個動作格進行水平翻轉(左右鏡像)。
**功能特性:**
- 根據設定的行列數精確分割格子
- 批量水平翻轉所有 Cell
- 支援即時原圖與結果預覽
- 保持 Alpha 透明頻道
- 一鍵下載翻轉後的完整 Sprite Sheet
**使用場景:** 動畫鏡像製作、Tilemap 對稱變體生成、角色動作調整
---
## 🚀 快速開始 ## 🚀 快速開始
### 環境需求 ### 環境需求
@@ -83,6 +97,7 @@ python tool.py
- **Grid Tool**: `http://localhost:8000/grid/` - **Grid Tool**: `http://localhost:8000/grid/`
- **Sprite Picker**: `http://localhost:8000/picker/` - **Sprite Picker**: `http://localhost:8000/picker/`
- **Shiny Maker**: `http://localhost:8000/shiny/` - **Shiny Maker**: `http://localhost:8000/shiny/`
- **Sprite Flipper**: `http://localhost:8000/flipper/`
--- ---
@@ -94,6 +109,8 @@ SpriteTool/
├── sprite_tool_fullstack.py # Grid Tool 子應用 ├── sprite_tool_fullstack.py # Grid Tool 子應用
├── sprite_webtool.py # Sprite Picker 子應用 ├── sprite_webtool.py # Sprite Picker 子應用
├── shiny_maker.py # Shiny Monster Maker 子應用 ├── shiny_maker.py # Shiny Monster Maker 子應用
├── rotate_webtool.py # Sprite Flipper 子應用
├── rotate.py # Flipper 核心處理邏輯
├── output/ # Grid Tool 導出目錄 ├── output/ # Grid Tool 導出目錄
├── shiny_output/ # Shiny Maker 導出目錄 ├── shiny_output/ # Shiny Maker 導出目錄
└── README.md # 本文件 └── README.md # 本文件
@@ -135,6 +152,14 @@ SpriteTool/
3. **實時預覽** - 右側即時顯示效果 3. **實時預覽** - 右側即時顯示效果
4. **下載** - 滿意後點擊「下載」按鈕 4. **下載** - 滿意後點擊「下載」按鈕
### Sprite Flipper 工作流
1. **上傳圖片** - 選擇要翻轉的 Sprite Sheet
2. **設定分割** - 輸入圖片對應的行列數Cols/Rows
3. **執行翻轉** - 點擊執行按鈕,系統將自動處理每個格子
4. **檢查結果** - 下方會顯示翻轉後的預覽圖
5. **下載** - 點擊下載按鈕取得成品
--- ---
## 🛠️ 技術架構 ## 🛠️ 技術架構
@@ -175,6 +200,10 @@ SpriteTool/
- `POST /shiny/process` - 處理色違調整 - `POST /shiny/process` - 處理色違調整
- `GET /shiny/download` - 下載成品 - `GET /shiny/download` - 下載成品
### Sprite Flipper
- `GET /flipper/` - 首頁
- `POST /flipper/flip` - 執行精靈翻轉處理
--- ---
## 🎨 UI/UX 特性 ## 🎨 UI/UX 特性
@@ -234,5 +263,5 @@ SpriteTool/
--- ---
**最後更新**: 2026 年 4 **最後更新**: 2026 年 5
**版本**: 1.0.0 **版本**: 1.1.0

View File

@@ -4,7 +4,7 @@ A powerful suite of game development tools providing a complete solution for Spr
## 🎯 Feature Overview ## 🎯 Feature Overview
SpriteTool is an integrated web application that combines three professional-grade tools into one: SpriteTool is an integrated web application that combines four professional-grade tools into one:
### 📏 Grid Tool ### 📏 Grid Tool
Used to define regular grid areas on an image and perform batch selections. Used to define regular grid areas on an image and perform batch selections.
@@ -53,6 +53,20 @@ Professional-grade "shiny" variant adjustment using HSV color space.
--- ---
### 🔄 Sprite Flipper
Quickly perform horizontal flipping (mirroring) for each animation cell in a Sprite Sheet.
**Key Features:**
- Precisely split cells based on configured row and column counts.
- Batch horizontal flip for all cells.
- Real-time preview of both original and result images.
- Preserves Alpha transparency channel.
- One-click download of the complete flipped Sprite Sheet.
**Use Cases:** Creating mirrored animations, symmetrical Tilemap variants, character action adjustments.
---
## 🚀 Quick Start ## 🚀 Quick Start
### Prerequisites ### Prerequisites
@@ -81,6 +95,7 @@ Visit the home page to see all available tools, or access them directly:
- **Grid Tool**: `http://localhost:8000/grid/` - **Grid Tool**: `http://localhost:8000/grid/`
- **Sprite Picker**: `http://localhost:8000/picker/` - **Sprite Picker**: `http://localhost:8000/picker/`
- **Shiny Maker**: `http://localhost:8000/shiny/` - **Shiny Maker**: `http://localhost:8000/shiny/`
- **Sprite Flipper**: `http://localhost:8000/flipper/`
--- ---
@@ -92,6 +107,8 @@ SpriteTool/
├── sprite_tool_fullstack.py # Grid Tool sub-app ├── sprite_tool_fullstack.py # Grid Tool sub-app
├── sprite_webtool.py # Sprite Picker sub-app ├── sprite_webtool.py # Sprite Picker sub-app
├── shiny_maker.py # Shiny Monster Maker sub-app ├── shiny_maker.py # Shiny Monster Maker sub-app
├── rotate_webtool.py # Sprite Flipper sub-app
├── rotate.py # Flipper core processing logic
├── output/ # Grid Tool export directory ├── output/ # Grid Tool export directory
├── shiny_output/ # Shiny Maker export directory ├── shiny_output/ # Shiny Maker export directory
└── README.md # This file └── README.md # This file
@@ -133,6 +150,14 @@ SpriteTool/
3. **Real-time Preview** - View the effect instantly on the right. 3. **Real-time Preview** - View the effect instantly on the right.
4. **Download** - Click "Download" once satisfied. 4. **Download** - Click "Download" once satisfied.
### Sprite Flipper Workflow
1. **Upload Image** - Select the Sprite Sheet to flip.
2. **Set Partition** - Enter the row and column counts (Cols/Rows).
3. **Execute Flip** - Click the button to process each cell automatically.
4. **Check Result** - View the flipped preview image below.
5. **Download** - Click the download button to get the result.
--- ---
## 🛠️ Technical Architecture ## 🛠️ Technical Architecture
@@ -173,6 +198,10 @@ SpriteTool/
- `POST /shiny/process` - Process shiny adjustment. - `POST /shiny/process` - Process shiny adjustment.
- `GET /shiny/download` - Download result. - `GET /shiny/download` - Download result.
### Sprite Flipper
- `GET /flipper/` - Home page.
- `POST /flipper/flip` - Execute sprite flipping process.
--- ---
## 🎨 UI/UX Features ## 🎨 UI/UX Features
@@ -232,5 +261,5 @@ Issues and Pull Requests are welcome!
--- ---
**Last Updated**: April 2026 **Last Updated**: May 2026
**Version**: 1.0.0 **Version**: 1.1.0