Cách thực hành tốt nhất cho thanh tiến trình trong OpenGL ES 2.0 là gì?

Nỗ lực của tôi: Tôi tạo một kết cấu (có thể là một màu hoặc bằng cách khác), và sau đó kéo dài kết cấu đó từ mức tối thiểu 0lên đến maxgiá trị tối đa . Điều này hoạt động, nhưng khiến tôi khá không hài lòng vì một số lý do, một trong số đó là:

Nếu tôi muốn các góc tròn khi thanh tiến triển, các cạnh bị đè bẹp hoặc kéo dài.

Câu hỏi của tôi: thực hành tốt nhất để đạt được kết quả thanh tiến trình là gì.

Suy nghĩ: Có cách nào để ngăn openGL vẽ bất cứ thứ gì từ một xgiá trị nhất định trở đi của một kết cấu không? Bằng cách đó tôi có thể vẽ kết cấu như nó sẽ xuất hiện, nhưng chỉ định giá trị củax .

Tôi đã tìm thấy cái này liên kết có khả năng hữu ích.

Cập nhật

Tôi có ấn tượng rằng sử dụng bộ đệm stpson có thể là cách để đi. Bộ đệm stprint cho phép xác định bất kỳ khu vực nào bạn thích thông qua đó hình học được hiển thị khác có thể được cắt bớt. Rõ ràng có nhiều cách sử dụng khác cho bộ đệm stpson, ví dụ như phản xạ.

Giải pháp có thể

Cuối cùng tôi đã đạt được những gì tôi muốn bằng cách sử dụng bộ đệm stpson kết hợp với trình tạo bóng của riêng tôi, vì OpenGL ES 2.0 không hỗ trợ glAplhaTestvà các chức năng liên quan. Đây là hình ảnh của kết quả:

Các kết cấu được vẽ vào bộ đệm stpson là một hình chữ nhật dài với các góc tròn. Các kết cấu được vẽ vào bộ đệm hình ảnh chỉ là một hình chữ nhật màu đỏ kéo dài, mà như bạn có thể thấy được cắt bớt vào nội dung stprint. Bạn cần phải viết shader của riêng mình để xử lý kênh alpha vì OpenGL ES 2.0 không hỗ trợglAplhaTest chức năng và liên quan.

Lưu ý - có lẽ đây không phải là ví dụ hình ảnh tốt nhất. Trong thực tế, giải pháp được trình bày cho phép bạn tiết lộ dần các nắp bên trái và bên phải, điều mà tôi không may không thể hiện trong hình trên.

java android opengl-es2

— Pixel
nguồn

Ý bạn là u trong kết cấu hoặc x trong tọa độ thế giới?

— wonderra

Tôi không chắc chắn trung thực - đó chỉ là một ý tưởng, nhưng tôi không chắc làm thế nào để đạt được điều đó.

— Pixel

Bạn có thể muốn chuyển kết cấu mặt nạ riêng biệt và một bộ đồng phục cho bạn shader để cho phép bỏ căng mặt nạ. Hoặc thậm chí dễ dàng hơn là tạo ra các hình tứ giác cho cả hai đầu và cơ thể riêng biệt.

— wonderra

Tại sao bạn không thể chỉ hiển thị một phần của thanh tiến trình bạn muốn kết xuất? Nếu nó ở mức 50%, thì hiển thị nửa bên trái, sử dụng nửa bên trái của kết cấu.

— user253751

@immibis cảm ơn ... Vào thời điểm đó tôi không biết bạn có thể ánh xạ bất kỳ phần nào của kết cấu thành các đỉnh và tôi chỉ hiển thị từng sprite riêng lẻ bằng cách sử dụng kết cấu rất riêng của nó. Đã sử dụng sprite atlours một thời gian, tôi hiểu làm thế nào tôi sẽ thực hiện đề xuất của bạn. Nó hiệu quả hơn nhiều so với ý tưởng ban đầu của tôi! Cảm ơn bạn.

— Pixel

Câu trả lời:

Không cần phải mang thêm thực thể, KISS

Chỉ cần kết xuất thanh tiến trình trong ba phần - nắp trái, nắp phải và thân máy. Sơ đồ:

 {left cap] [body] [right cap}

Mũ trái và phải thường luôn giống nhau - nửa vòng tròn có độ trong suốt. Các kết cấu cơ thể cần phải được kéo dài mà không có tác dụng đáng chú ý.

Mũ trái và phải thường được hiển thị không giới hạn và tỷ lệ phần trăm cần thiết được hiển thị với chiều rộng cơ thể. Vì vậy, ví dụ 0% có thể là một thanh trống, 1% là mũ có thân rộng 0.

Đọc thêm để kéo dài mà không bị biến dạng ở cả hai trục: google cho "nút chín miếng".

— Kromster
nguồn

Tôi thích nguyên tắc. Tuy nhiên, tôi muốn có một cái nhìn linh hoạt cho các thanh này và phương pháp được mô tả không cho phép (nắp trái] hoặc [nắp phải) dần dần lộ diện. Việc triển khai hiện tại của tôi hiện có :-D Ngoài ra, giờ đây tôi có thể đạt được nhiều hiệu ứng khác nhờ kiến thức về bộ đệm stpson. Tôi chắc chắn sẽ giữ KISS trong tâm trí!

— Pixel

Thông thường có thể được thay thế bằng một mặt nạ kết cấu. Chỉ trong trường hợp nó không có sẵn hoặc quá mức cho một thanh tiến trình duy nhất)

— Kromster

Tôi sẽ xem qua một chút. Tôi không biết gì về mặt nạ kết cấu!

— Pixel

Có một số cách để làm điều này.

Đây là giải pháp được mô tả bởi poirot:

Cuối cùng tôi đã đạt được những gì tôi muốn bằng cách sử dụng bộ đệm stpson kết hợp với trình tạo bóng của riêng tôi ... Kết cấu được vẽ vào bộ đệm stpson là một hình chữ nhật dài với các góc tròn. Các kết cấu được vẽ vào bộ đệm hình ảnh chỉ là một hình chữ nhật màu đỏ kéo dài, mà như bạn có thể thấy được cắt bớt vào nội dung stprint.

Thay vào đó, bạn có thể sử dụng ba trường hợp hình học; một nửa hình tròn cho mỗi đầu và một hình chữ nhật được khâu ở giữa. Lưu ý làm thế nào điều này không yêu cầu shader tùy chỉnh hoặc stenciling. (Giải pháp này có vẻ giống như được đề xuất trong các bình luận của wonderra.) Giải pháp này là yêu thích của tôi vì một số lý do.

Một lưu ý về bộ đệm stpson, nó có thể được ghép nhiều lớp để khử răng cưa cho một khung hình đầy đủ mà không cần sự can thiệp của ứng dụng. Tuy nhiên, kiểm tra Alpha (shader hay không) là một hoạt động phân đoạn không được ghép nhiều lần. Nếu bạn kết hợp hai bộ đệm stpson không bao giờ thực sự nhiều mẫu; tất cả các mẫu được xử lý như nhau, do đó không khử răng cưa.

— Andreas
nguồn

Nhưng sử dụng một nửa hình tròn, hình chữ nhật và nửa hình tròn cuối cùng, làm thế nào để bạn thể hiện độc đáo tiến trình của nửa hình tròn? Ví dụ: giả sử nửa vòng tròn chiếm 10% mỗi hình và hình chữ nhật còn lại 80%. Làm thế nào tôi có thể rút ra 5% độc đáo? Cách tiếp cận stprint cho phép hiển thị tiến trình trước hoặc sau khi bắt đầu / kết thúc hình chữ nhật, tức là bất cứ nơi nào giữa chiều rộng của một nửa vòng tròn.

— Pixel

@poirot Vâng tôi biết. Nó không rõ ràng từ ví dụ của bạn như thế nào bạn muốn nó trông như thế nào khi thanh trống hoặc gần trống. Một biến thể sẽ là hiển thị hình dạng thanh thành stprint (viết cái) và sau đó điền vào khu vực mặt nạ (nơi có những cái) với một hình chữ nhật với chiều dài dựa trên%. Khi thanh gần hết, hình chữ nhật không che hết vùng bị che. Điều đó có ý nghĩa gì với bạn không? Nó tương tự nhưng không yêu cầu bất kỳ chương trình shader bổ sung nào và multisampling vẫn có thể hoạt động.

— Andreas

Cuối cùng, tôi đã sử dụng thực tế là OpenGL cho phép bạn ánh xạ bất kỳ phần nào của kết cấu tới các đỉnh của bạn. Vì vậy, giả sử bạn có một kết cấu với ba trái tim liên tiếp, chiều rộng 300 và chiều cao 80, và bạn chỉ muốn hiển thị hai phần ba trên màn hình. Sau đó, bạn sẽ ánh xạ kết cấu (0, 0, 200, 80) vào các đỉnh của bạn, nhưng đảm bảo các đỉnh của bạn cũng được giảm tương ứng. Tiết kiệm lộn xộn với bộ đệm stpson và nhanh chóng và thanh lịch hơn nhiều. Có vẻ rõ ràng, nhưng trở lại khi tôi nghĩ mỗi sprite phải sử dụng một kết cấu riêng biệt tôi không thể nhìn thấy nó!

— Pixel
nguồn