🖥️
iOS App with Pop
UIKit Swift 5
UIKit Swift 5
  • iOS App development
  • Swift
    • Variable & Constant
    • Number & String
    • Operator
    • Array, Dictionary & Tuple
    • Enum
    • Optional
    • Function
    • Class & Struct
    • Branching
    • Loops
    • Error handler
    • Protocol
    • Extension
  • Create New Project
  • Introduction to Xcode
  • Scene-Based Life-Cycle
  • UIViewController
  • Storyboard
  • First Run
  • Display todo list
  • Basic Auto Layout
  • MVC
  • Model
  • Binding TableView
  • Binding TableViewCell
  • TableViewDelegate
  • Add navigationBar with + button
  • Add new item page
  • TextField and Switch
  • Binding action
  • Add mock item to todo list
  • What is weak?
  • Finish add item
  • Delete todo item
  • Edit todo item
  • Custom new layout
  • Adding new delegate
  • Refactor
  • Pushing edit view
  • Large navigation
  • Drag item
  • Drop item (in app)
  • Save data
  • Where to go from here?
Powered by GitBook
On this page

Display todo list

PreviousFirst RunNextBasic Auto Layout

Last updated 2 years ago

สร้างหน้าจอแสดงรายการกัน

เราจะใช้ TableView ในการแสดงรายการ Todo item ของเรา เริ่มที่เลือก Table View ใน Object Library

จากนั้นให้เราลากลงมาใส่ใน View หลักของเราเลยดังรูป แบบนี้

จากนั้นเราสามารถลากเพื่อปรับขนาดของ TableView ที่เราใส่ลงไปได้

แต่จะพบว่าเมื่อเราเปลี่ยนรุ่น device เป็น iPhone อื่น เช่น iPhone 11 ที่หน้าจอมีขนาดใหญ่กว่า ตัว TableView เราจะไม่พอดี หรือว่าเราเปลี่ยนไปใช้ iPhone 13 mini ที่มีขนาดหน้าจอเล็กกว่าจะพบว่า TableView ของเราจะล้นหน้าจอ เพื่อแก้ปัญหานี้เราจะใช้การจัด Auto Layout ในการ Adapt view ของเราให้เข้ากับหน้าจอ

โดยปกติ Storyboard จะไม่แสดงเส้นขอบเขตของ View แต่ละอันบางครั้งทำให้เราเห็นไม่ชัด เราสามารถเปิดให้เห็นได้ง่ายขึ้นที่ Editor -> Canvas -> Show Bounds Rectangles

เลือก Table View
ลาก TableView จาก Object Library มาใส่ลงใน View หลัก
ขนาดของตารางที่เล็กกว่า หรือใหญ่กว่า เมื่อเปลี่ยนชนิดอุปกรณ์ที่มีขนาดหน้าจอไม่เท่ากัน
Show Bounds Rectangles