2012-03-19 45 views
7

Tôi đang cố gắng bevel đường dẫn trong đồ họa cốt lõi. Có ai đã làm điều này đã cho hình dạng tùy ý và nếu như vậy là họ sẵn sàng chia sẻ mã?Vát đường dẫn/hình dạng trong Đồ họa chính

Tôi đã bao gồm việc triển khai của mình bên dưới. Tôi sử dụng ba biến để xác định bevel: CGFloat bevelSize, UIColor highlightColor, UIColor shadow. Lưu ý rằng góc của nguồn sáng luôn là 135 độ. Tôi chưa hoàn thành việc thực hiện điều này, nhưng đây là những gì tôi đang cố gắng làm, chia thành hai phần. Phần một, tạo ra các tiêu điểm:

  1. Tôi tìm thấy các bisectors cho các góc giữa mỗi đường liền kề trong đường dẫn.
  2. Đối với cung, bisector là đường vuông góc với đường được tạo bởi hai điểm cuối của cung, bắt nguồn từ điểm giữa. Điều này sẽ chăm sóc phần lớn các tình huống trong đó một vòng cung được sử dụng. Tôi không lấy bisector của một vòng cung và một dòng. Các bisector arc nên làm việc tốt trong những trường hợp.
  3. Sau đó tôi tính toán các tiêu điểm dựa trên giao điểm của mỗi bisectors lân cận.
  4. Nếu tiêu điểm nằm trong hình dạng được sử dụng, nếu không nó sẽ bị loại bỏ.

Mục đích của việc tạo tiêu điểm là 'thu nhỏ' hình dạng tương ứng.

Phần thứ hai phức tạp hơn một chút. Tôi cần thiết tạo ra mỗi bên/phân đoạn của hình dạng vát. Tôi làm điều này bằng cách vẽ 'in' (bởi bevelSize) mỗi điểm của hình dạng ban đầu dọc theo bán kính của đường kéo dài từ tiêu điểm gần nhất tới điểm được đề cập. Khi tôi có hai 'bevelPoints' liên tiếp, tôi tạo một UIBezierPath mở rộng từ bevelPoints đến các điểm gốc và quay lại bevelPoints (lưu ý, điều này bao gồm các cung). Điều này tạo ra một 'bên/phân đoạn' tôi có thể sử dụng để điền vào. Ở các cạnh thẳng, tôi chỉ cần tô màu bóng hoặc tô sáng, tùy thuộc vào góc của cạnh. Đối với vòng cung, tôi xác định radian 'arc'. Nếu vòng cung đó chứa một góc chuyển tiếp (M_PI_4 hoặc M_PI + M_PI_4), tôi điền nó với một gradient (từ bóng để làm nổi bật hoặc tô sáng đến bóng tối, cái nào là thích hợp). Nếu không, tôi tô nó bằng một màu đồng nhất.

Cập nhật

tôi đã tách ra câu trả lời của tôi (xem dưới đây) vào một bài viết trên blog riêng. Tôi không còn sử dụng các chi tiết triển khai mà bạn nhìn thấy ở trên nhưng tôi vẫn giữ nó ở đó để tham khảo. Tôi hy vọng điều này sẽ giúp bất kỳ ai khác tìm cách sử dụng Core Graphics.

+0

Câu hỏi dài và bao gồm rất nhiều chi tiết. Bạn có thể đơn giản hóa nó không? –

+0

Sắp xếp. Phần đầu tiên của câu hỏi là câu hỏi chính: Có ai biết làm thế nào để bevel một hình dạng tùy ý trong lõi đồ họa? Phần còn lại chỉ là chi tiết cách tôi thực hiện vát bản thân mình (mà tôi đã hoàn thành bây giờ). Nó hoạt động tốt trên một vài hình dạng (nhưng không phải tất cả). Tôi để câu hỏi mở trong trường hợp ai đó có một phương pháp. –

+0

Tôi đã xem xét việc đăng giải pháp của mình, nhưng đó chỉ là khoảng 400 dòng mã ... dường như rất nhiều để đăng. –

Trả lời

3

Vì vậy, cuối cùng tôi đã cố gắng viết một thói quen để bevel hình dạng tùy ý trong đồ họa cốt lõi. Nó đã kết thúc được rất nhiều công việc, nhiều hơn tôi dự đoán ban đầu, nhưng nó là một dự án thú vị. Tôi đã đăng một lời giải thích và mã để thực hiện bevel trên blog của tôi. Chỉ cần lưu ý rằng tôi đã không tạo ra một lớp học đầy đủ (hoặc thiết lập các lớp học) cho việc này. Mã này đã được tích hợp vào một lớp lớn hơn nhiều tôi sử dụng để làm tất cả các bản vẽ đồ họa cốt lõi của tôi. Tuy nhiên, tất cả các mã bạn cần để bevel hình dạng tùy ý nhất là có.

CẬP NHẬT

Tôi đã viết lại các mã như c thẳng và chuyển nó thành một tập tin riêng biệt. Nó không còn phụ thuộc vào bất kỳ biến cá thể nào khác để hàm beveling có thể được gọi từ bên trong bất kỳ ngữ cảnh nào.

Tôi giải thích mã và quá trình tôi sử dụng để bevel đây: Beveling Shapes In Core Graphics

Đây là mã: Github : CGPathBevel.

Mã không hoàn hảo: Tôi đang mở cho các đề xuất/chỉnh sửa/cách làm tốt hơn.

+0

bài viết sẽ rất tuyệt. Tôi sẽ phải thử nó sớm thôi. Cảm ơn! +1 –