# สื่อริชมีเดียโมดอลของ Android

<Aside type="note" title="สำคัญ">
พร้อมใช้งานตั้งแต่ SDK 6.7.13
</Aside>

คุณสมบัติ Android Modal Rich Media ช่วยให้นักพัฒนาสามารถแสดงเนื้อหา HTML ภายในหน้าต่างป๊อปอัปโมดอลภายในแอปพลิเคชันของตนได้ ป๊อปอัปนี้ไม่บล็อกองค์ประกอบ UI อื่นๆ และสามารถปิดได้อย่างง่ายดายโดยใช้ท่าทางการปัด โมดอลมีตัวเลือกการปรับแต่งมากมายสำหรับรูปลักษณ์ พฤติกรรม แอนิเมชัน และอื่นๆ ซึ่งมอบประสบการณ์ผู้ใช้ที่มีความยืดหยุ่นสูง

## คุณสมบัติหลัก

- **UI ที่ไม่ปิดกั้น**: โมดอลไม่ปิดกั้นการโต้ตอบกับองค์ประกอบ UI อื่นๆ
- **ท่าทางการปัดที่ปรับแต่งได้**: กำหนดค่าท่าทางการปัดเพื่อปิดโมดอลในทิศทางต่างๆ
- **การวางตำแหน่งที่ยืดหยุ่น**: เลือกตำแหน่งที่โมดอลจะปรากฏบนหน้าจอ (ด้านบน, ตรงกลาง หรือด้านล่าง)
- **แอนิเมชันที่กำหนดเอง**: ควบคุมวิธีการปรากฏและหายไปของโมดอลด้วยประเภทแอนิเมชันที่แตกต่างกัน
- **ปิดได้ผ่านการปัด**: ผู้ใช้สามารถปัดเพื่อปิดโมดอลจากทิศทางใดก็ได้
- **ระยะเวลาแอนิเมชันที่ปรับได้**: ปรับความเร็วของแอนิเมชันโมดอลอย่างละเอียด
- **การจัดการแถบสถานะ**: ตัวเลือกในการแสดงโมดอลด้านล่างหรือด้านบนแถบสถานะ
- **ความกว้างของหน้าต่างที่ปรับได้**: ตัวเลือกในการตั้งค่าความกว้างของโมดอลให้เต็มหน้าจอหรือปรับตามเนื้อหา

## การใช้งาน

### การเปิดใช้งาน modal Rich media

เพื่อเปิดใช้งานคุณสมบัติ **Modal Rich Media** คุณต้องกำหนดค่าในไฟล์ `AndroidManifest.xml` ของแอปพลิเคชันของคุณโดยเพิ่มรายการ metadata ต่อไปนี้:

```xml
<meta-data
    android:name="com.pushwoosh.rich_media_type"
    android:value="Modal" />
```
## การกำหนดค่าเริ่มต้น
รูปลักษณ์และพฤติกรรมของโมดอลสามารถปรับแต่งได้โดยการตั้งค่าการกำหนดค่าเริ่มต้นผ่าน `RichMediaManager` การกำหนดค่านี้ช่วยให้คุณสามารถระบุว่าโมดอลจะทำงานอย่างไร ปรากฏที่ไหน สามารถปิดได้อย่างไร และประเภทของแอนิเมชันที่ใช้

## ตัวเลือกการปรับแต่ง

### ตำแหน่งของมุมมองโมดอล

คุณสามารถตั้งค่าตำแหน่งของโมดอลบนหน้าจอได้โดยใช้ `setViewPosition()` ค่าที่ใช้ได้สำหรับพารามิเตอร์นี้คือ:

- `TOP`
- `CENTER` (ค่าเริ่มต้น)
- `BOTTOM`

### ประเภทแอนิเมชันการปิด

ปรับแต่งวิธีการปิดโมดอลด้วย `setDismissAnimationType()` ตัวเลือกที่ใช้ได้รวมถึง:

- `FADE_OUT` (ค่าเริ่มต้น)
- `SLIDE_UP`
- `SLIDE_DOWN`
- `SLIDE_LEFT`
- `SLIDE_RIGHT`
- `NONE`

### ประเภทแอนิเมชันการแสดง

กำหนดวิธีการปรากฏของโมดอลด้วย `setPresentAnimationType()` ตัวเลือกที่ใช้ได้คือ:

- `FADE_IN`
- `SLIDE_UP`
- `SLIDE_RIGHT`
- `DROP_DOWN`
- `SLIDE_LEFT`
- `NONE` (ค่าเริ่มต้น)

### การกำหนดค่าท่าทางการปัด

โมดอลสามารถปิดได้ด้วยท่าทางการปัดในทิศทางต่างๆ โดยใช้ `setSwipeGesture()` ท่าทางการปัดที่ใช้ได้รวมถึง:

- `UP`
- `LEFT`
- `RIGHT`
- `DOWN`
- `NONE` (ค่าเริ่มต้น)

### ระยะเวลาของแอนิเมชัน

ควบคุมความเร็วของแอนิเมชันโดยการตั้งค่า `animationDuration()` ในหน่วยมิลลิวินาที ระยะเวลาจะถูกระบุเป็นค่าจำนวนเต็ม ซึ่งแทนเวลาในหน่วยมิลลิวินาที

### ความกว้างของหน้าต่างโมดอล

ความกว้างของโมดอลสามารถตั้งค่าได้โดยใช้ `setWindowWidth()` ซึ่งจะกำหนดว่าโมดอลจะใช้ความกว้างเต็มหน้าจอหรือเพียงพอที่จะพอดีกับเนื้อหา ค่าที่เป็นไปได้คือ:

- `FULL_SCREEN` (ค่าเริ่มต้น)
- `WRAP_CONTENT`

### การจัดการแถบสถานะ

โดยค่าเริ่มต้น โมดอลจะไม่ครอบคลุมแถบสถานะ หากต้องการให้โมดอลปรากฏใต้แถบสถานะ ให้ตั้งค่าคุณสมบัติ `setStatusBarCovered()` เป็น `true`


## ตัวอย่างการกำหนดค่า
นี่คือตัวอย่างบางส่วนที่แสดงแอนิเมชันต่างๆ รวมถึงท่าทางการปัด การปรากฏแบบเลื่อนเข้า การปิดแบบเฟดเอาท์ ระยะเวลาแอนิเมชันที่แตกต่างกัน และความกว้างของหน้าจอที่หลากหลาย ด้านล่างนี้ คุณยังสามารถพบการกำหนดค่าที่ใช้เพื่อให้ได้ผลลัพธ์เหล่านี้

### ตัวอย่างท่าทางการปัด

<video src="/android-push-notifications-android-modal-rich-media-1.webm" title="โมดอล Android พร้อมท่าทางการปัดไปทางขวาเพื่อปิด" autoplay loop muted playsinline />

```
        RichMediaManager.setDefaultRichMediaConfig(new ModalRichmediaConfig()
                .setStatusBarCovered(false)
                .setSwipeGesture(ModalRichMediaSwipeGesture.RIGHT)
                .setViewPosition(ModalRichMediaViewPosition.CENTER)
                .setDismissAnimationType(ModalRichMediaDismissAnimationType.SLIDE_RIGHT)
                .setPresentAnimationType(ModalRichMediaPresentAnimationType.SLIDE_FROM_LEFT)
                .setAnimationDuration(800)
                .setWindowWidth(ModalRichMediaWindowWidth.WRAP_CONTENT));
```
### ตัวอย่างแอนิเมชันแบบดร็อปดาวน์

<video src="/android-push-notifications-android-modal-rich-media-2.webm" title="โมดอล Android ที่ปรากฏขึ้นพร้อมแอนิเมชันแบบดร็อปดาวน์และปัดขึ้นเพื่อปิด" autoplay loop muted playsinline />

```
        RichMediaManager.setDefaultRichMediaConfig(new ModalRichmediaConfig()
                .setSwipeGesture(ModalRichMediaSwipeGesture.UP)
                .setViewPosition(ModalRichMediaViewPosition.TOP)
                .setDismissAnimationType(ModalRichMediaDismissAnimationType.SLIDE_UP)
                .setPresentAnimationType(ModalRichMediaPresentAnimationType.DROP_DOWN)
                .setAnimationDuration(1000));

```

### ตัวอย่าง Rich media ที่ด้านล่าง

<video src="/android-push-notifications-android-modal-rich-media-3.webm" title="โมดอล Android ที่แสดงที่ด้านล่างพร้อมการปิดแบบ fade out และแอนิเมชันแบบ slide up" autoplay loop muted playsinline />

```
        RichMediaManager.setDefaultRichMediaConfig(new ModalRichmediaConfig()
                .setSwipeGesture(ModalRichMediaSwipeGesture.DOWN)
                .setViewPosition(ModalRichMediaViewPosition.BOTTOM)
                .setDismissAnimationType(ModalRichMediaDismissAnimationType.FADE_OUT)
                .setPresentAnimationType(ModalRichMediaPresentAnimationType.SLIDE_UP)
                .setAnimationDuration(2000));
```

## สรุป
คุณสมบัติ Android Modal Rich Media เป็นวิธีที่ง่ายและยืดหยุ่นในการนำเสนอเนื้อหา HTML ภายในแอปของคุณโดยไม่ขัดขวางประสบการณ์ของผู้ใช้ ด้วยตัวเลือกการปรับแต่งที่หลากหลาย รวมถึงท่าทางการปัด แอนิเมชัน การวางตำแหน่ง และความกว้างของหน้าต่าง คุณสามารถสร้างการโต้ตอบที่ราบรื่นและน่าสนใจสำหรับผู้ใช้ของคุณได้