Bài 19: UISegmentedControl

UISegmentControl

UISegmentedControl là một control với nhiều phân đoạn bên trong. Mỗi phân đoạn đóng vai trò như một Button. Mỗi phân đoạn có thể hiển thị tiêu đề hoặc hình ảnh.

1. Khởi tạo bằng kéo thả

Các bạn tạo project vào kéo thả UISegmentedControl vào Main.storyboard như hình:

Kéo thả UISegmentedControl
Hình 1.1 Kéo thả UISegmentedControl

Các bạn cũng có thể set image cho button trong UISegmentedControl, ở đây mình lấy luôn hình System trong Xcode (từ Xcode 11 trở lên mới có nhé).

Set image cho UISegmentControl
Hình 1.2 Set image cho UISegmentControl

Tiếp theo để bắt được select index của UISegmentControl các bạn chỉ việc ánh xạ action cho UISegmentedControl:

Action cho UISegmentControl
Hình 1.3 Action cho UISegmentControl

Trong action của UISegmentControl các bạn thêm đoạn code sau:

Đoạn code trên sẽ bắt selectedSegmentIndex khi user tương tác với Segment và thực hiện hành động tương ứng, ở đây mình chỉ in ra giá trị selectedSegmentIndex.

Chạy project mỗi khi chọn Segment console sẽ in ra vị trí tương ứng:

Kết quả khi chạy project
Hình 1.4 Kết quả khi chạy project

2. Tạo UISegmentControl bằng code

Các bạn tham khảo đoạn code khởi tạo và bắt sự kiện cho UISegmentControl:

Tương tự như khởi tạo bằng kéo thả đoạn code trên cũng tạo ra một UISegmentControl với 4 button bên trong và cũng có action khi user tương tác lên.

Kết quả tạo UISegmentControl bằng code:

Kết quả tạo UISegmentControl bằng code
Hình 2.1 Kết quả tạo UISegmentControl bằng code

Cảm ơn bạn đã theo dõi bài viết, nếu có thắc mắc gì vui lòng để lại bình luận bên dưới.

Bạn có thể tham khảo khoá học lập trình iOS tại laptrinh0kho.com. Các khoá học từ cơ bản đến nâng cao, được thực tập doanh nghiệp. Bạn sẽ được cung cấp kiến thức có hệ thống với đội ngũ giảng viên giàu kinh thực tế và am hiểu sư phạm. Hãy liên hệ ngay để được tư vấn miễn phí theo thông tin bên dưới:

LAPTRINH0KHO.COM

  • 138/36 Nguyễn Xí, P. 26, Q. Bình Thạnh, TP.HCM
  • Hotline: 0347.750.760 (Kết bạn Zalo để tư vấn)
  • Email: laptrinh0kho@gmail.com
  • Website: www.laptrinh0kho.com
  • FanPage : laptrinh0kho.com

Leave a Reply

Your email address will not be published. Required fields are marked *