หากคุณต้องการเพิ่ม Cell (หรือส่วนประกอบภายใน) เข้าไปในแถวของตารางใน Figma โดยเฉพาะเมื่อมีการใช้ Auto Layout อยู่ มีวิธีทำง่าย ๆ ดังนี้ครับ:
วิธีการแทรก Cell ข้างหน้า
- เลือก Cell หรือ Component ที่คุณต้องการนำไปวาง (เช่น ไอคอน หรือช่องว่างอันใหม่) แล้วกด
Cmd + C(Mac) หรือCtrl + Cเพื่อคัดลอก - คลิกเลือก Cell แรก ที่อยู่ในแถวนั้น
- กด
Cmd + V(Mac) หรือCtrl + Vเพื่อวาง- โดยปกติ Figma จะวางไว้ ข้างหลัง ตัวที่เราเลือก ให้คุณกด ปุ่มลูกศรซ้าย (←) บนคีย์บอร์ด เพื่อเลื่อนตำแหน่งมันมาไว้ข้างหน้าสุดครับ
วิธีการลากวาง
หากโครงสร้างเป็น Auto Layout คุณสามารถทำได้ดังนี้
- คลิกค้างที่วัตถุที่ต้องการเพิ่ม
- ลากเข้าไปในแถวตาราง จนเห็น เส้นสีฟ้าแนวตั้ง ปรากฏขึ้นที่ด้านหน้าสุดของช่อง “Action”
- ปล่อยเมาส์เพื่อวางวัตถุลงไป
ตรวจสอบโครงสร้าง Layer
ถ้าทำตามข้างบนแล้วไม่ได้ ให้เช็คที่แถบ Layers ด้านซ้ายมือครับ:
- ดูว่าตัว “Row” นั้นเปิด Auto Layout ไว้หรือไม่
- ถ้าเป็น Component Instance (ตัวลูกที่เป็นสีม่วงและล็อคไว้) คุณอาจจะเพิ่มเข้าไปตรง ๆ ไม่ได้ ต้องไปเพิ่มที่ Main Component หรือทำการ Detach Instance ก่อน
เพิ่ม Layer
หากคุณต้องการเพิ่ม Cell เข้าไปในแถวของตารางใน Figma โดยเฉพาะเมื่อมีการใช้ Auto Layout อยู่ มีวิธีทำง่าย ๆ ดังนี้ครับ:
1. วิธีการแทรก Cell ข้างหน้า
- เลือก Cell หรือ Component ที่คุณต้องการนำไปวาง แล้วกด
Cmd + CหรือCtrl + Cเพื่อคัดลอก - คลิกเลือก Cell แรก ที่อยู่ในแถวนั้น
- กด
Cmd + VหรือCtrl + Vเพื่อวาง- โดยปกติ Figma จะวางไว้ ข้างหลัง ตัวที่เราเลือก ให้คุณกด ปุ่มลูกศรซ้าย (←) บนคีย์บอร์ด เพื่อเลื่อนตำแหน่งมันมาไว้ข้างหน้าสุดครับ
2. วิธีการลากวาง
หากโครงสร้างเป็น Auto Layout คุณสามารถทำได้ดังนี้:
- คลิกค้างที่วัตถุที่ต้องการเพิ่ม
- ลากเข้าไปในแถวตาราง (Row) จนเห็น เส้นสีฟ้าแนวตั้ง ปรากฏขึ้นที่ด้านหน้าสุดของช่อง “Action”
- ปล่อยเมาส์เพื่อวางวัตถุลงไป
3. ตรวจสอบโครงสร้าง Layer
ถ้าทำตามข้างบนแล้วไม่ได้ ให้เช็คที่แถบ Layers ด้านซ้ายมือครับ:
- ดูว่าตัว “Row” นั้นเปิด Auto Layout ไว้หรือไม่ (สังเกตไอคอน ||= หรือ ||)
- ถ้าเป็น Component Instance (ตัวลูกที่เป็นสีม่วงและล็อคไว้) คุณอาจจะเพิ่มเข้าไปตรง ๆ ไม่ได้ ต้องไปเพิ่มที่ Main Component หรือทำการ Detach Instance ก่อน (แต่แนะนำให้แก้ที่ต้นฉบับจะดีกว่าครับ)
ทริคเพิ่มเติม: การปรับระยะห่าง
เมื่อเพิ่ม Cell เข้าไปแล้ว ถ้าช่องไฟดูเบียดกันเกินไป
- เลือกที่ตัว Row
- ไปที่แผง Auto Layout ด้านขวา
- ปรับค่า Gap between items เพื่อให้ไอคอนดูไม่อึดอัดครับ
อ่านเพิ่มเติม