# 標籤布局優化記錄

## 問題描述
Feature、Animal、Film 三個標籤中，Film 標籤在首次加載時不可見，需要點擊其他標籤後才會顯示。

## 優化歷程

### 第一輪優化（字體和下劃線）
- 字體大小：22sp → 16sp
- 下劃線高度：3dp → 2dp
- 標籤對齊：居中 → 左對齊

### 第二輪優化（間距調整）
- 標籤間距：減小為 12dp
- 容器寬度：從平均分配改為自適應（wrap_content）

### 第三輪優化（修復 Film 被遮擋）
- 字體大小：16sp → 14sp
- 標籤間距：12dp → 10dp
- 容器與搜索圖標間距：16dp → 8dp

### 第四輪優化（全面空間釋放）
- 頭部 padding：16dp → 12dp（左右）
- 搜索圖標：28dp → 24dp
- 容器右邊距：8dp
- 標籤間距：保持 10dp

### 第五輪優化（當前版本）✅
- **字體大小**：14sp → **13sp**
- **標籤間距**：12dp → **10dp**
- **搜索圖標**：**24dp**
- **頭部 padding**：**12dp**（左右）
- **容器右邊距**：**8dp**

## 當前配置總結

| 項目 | 數值 |
|-----|------|
| 字體大小 | 13sp |
| Feature ↔ Animal 間距 | 10dp |
| Animal ↔ Film 間距 | 10dp |
| 容器 ↔ 搜索圖標 | 8dp |
| 頭部左右 padding | 12dp |
| 搜索圖標大小 | 24dp × 24dp |
| 下劃線高度 | 2dp |
| 對齊方式 | 左對齊 |

## 視覺布局

```
┌───────────────────────────────────────┐
│                                       │
│ Feature Animal Film          [🔍]    │
│ ══════  ------  ----         24dp   │
│ ↑       ↑       ↑            圖標   │
│ 13sp    10dp    10dp                │
│                                      │
│ 12dp padding (左右)                  │
└───────────────────────────────────────┘
```

## 總空間節省

從最初版本到當前版本：
- 字體縮小：22sp → 13sp = **節省約 40%**
- 標籤間距：原始較大 → 10dp = **節省約 30-40dp**
- 頭部 padding：16dp → 12dp = **節省 8dp**
- 搜索圖標：28dp → 24dp = **節省 4dp**
- 容器邊距優化 = **節省 8dp**

**總計節省：約 50-60dp 空間**

## 測試結果

待用戶反饋...

## 如果問題仍然存在

如果 Film 標籤依然在初始時不可見，可以考慮以下方案：

### 方案 A：進一步縮小
1. 字體：13sp → 12sp
2. 間距：10dp → 8dp 或 6dp
3. 頭部 padding：12dp → 10dp

### 方案 B：使用橫向滾動
使用 HorizontalScrollView 包裹標籤容器，允許用戶左右滑動查看所有標籤。

```xml
<HorizontalScrollView
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:scrollbars="none">
    <LinearLayout>
        <!-- 標籤 -->
    </LinearLayout>
</HorizontalScrollView>
```

### 方案 C：縮短標籤名稱
- Feature → Feat
- Animal → Anim  
- Film → Film（保持）

### 方案 D：使用圖標代替文字
為每個標籤設計一個圖標，減少寬度占用。

## 推薦方案

**當前優先級：**
1. ✅ 已完成：字體 13sp + 間距 10dp
2. 📋 待測試：如果不行，嘗試方案 A（進一步縮小）
3. 📋 備選：方案 B（橫向滾動）最穩妥但體驗稍差
4. 📋 備選：方案 C（縮短名稱）體驗好但需要修改文案

---

**最後更新**：2024年12月2日
**當前狀態**：等待用戶測試反饋