Những kỹ thuật kết xuất nào tôi sẽ sử dụng để vẽ hiệu ứng đổ bóng cho thẻ trong trò chơi bài?


13

Loại thuật toán tô bóng nào có thể được sử dụng để tạo bóng như thế này? nhập mô tả hình ảnh ở đây

cái tôi đang làm tương tự nhưng tất cả đều được thực hiện với API bản vẽ 2D được cung cấp bởi OpenGL nên không có tọa độ Z.

Ngoài ra, đối với chính bàn tay, tôi thực sự muốn có được cảm giác bóng mờ như đã thấy ở đây: nhập mô tả hình ảnh ở đây

Tôi chỉ không chắc làm thế nào để đạt được một cái nhìn bóng mờ gần đó.

Số lượng thẻ bị ràng buộc thay đổi và các thẻ được ném lên bàn để tôi không thể sử dụng bất kỳ loại bản đồ ánh sáng nào.

Tôi nên xem xét các loại thuật toán nào (ngoài việc làm mờ mà tôi biết sẽ cần phải làm gì?)

Cảm ơn

Cập nhật

Tôi đang làm một trò chơi thẻ 2D. Tôi muốn thêm phần bù bóng từ các thẻ, giống như:

nhập mô tả hình ảnh ở đây

Cách tôi nghĩ để làm điều đó là:

  • Giữ một kết cấu có cùng kích thước với backbuffer.
  • Vẽ hình chữ nhật tối làm thẻ tạm thời cho kết cấu đó.

  • Làm mờ kết cấu đó.

  • Vẽ thẻ của tôi để kết cấu đó.
  • Làm thêm ánh sáng trên thẻ.
  • Vẽ kết cấu này cho backbuffer.

Câu hỏi của tôi là:

  • Đây có phải là cách đúng đắn để làm điều này?

  • Có cách nào để làm điều đó mà không kết xuất thành kết cấu (giữ một bitmap
    lớn như backbuffer) không?

  • Có an toàn không khi cho rằng kích thước kết cấu tối đa sẽ không bị
    vượt quá kích thước backbuffer? (Ý tôi là, nếu backbuffer
    là 2000x3000, thì có an toàn không khi nói rằng tôi có thể tạo một kết cấu trong
    bộ nhớ video có kích thước đó?

Cảm ơn


1
Một điểm thẩm mỹ về vấn đề thứ hai của bạn: điều đó thực sự không thể nếu bạn thực sự cầm những thẻ đó trong tay. Các lá bài được ép cạnh nhau không được đánh bóng một cách đáng kể. Không, trừ khi bạn đang giữ rất nhiều trong số họ. Bạn thực sự không thể giữ thẻ theo cách chúng được mô tả trong hình ảnh đó; những thẻ đó trông giống như chúng cách nhau vài milimet; họ không bằng phẳng với nhau. Tôi sẽ không lo lắng về nó.
Nicol Bolas

Câu trả lời:


18

Tôi nghĩ rằng mọi người đang đưa ra giải pháp quá phức tạp cho vấn đề này ..

nhập mô tả hình ảnh ở đây

Vì vậy, trước tiên, chúng tôi có thẻ (hoặc bất cứ điều gì bạn muốn rút ra), được mô tả ở đây bởi (a). Tiếp theo, chúng tôi lấy một bản sao của nó, điền nó vào màu đen và chạy một vệt mờ Gaussian trên nó (b). Tất cả điều này xảy ra trong photoshop hoặc bất cứ công cụ nghệ thuật yêu thích nào của bạn.

Tiếp theo, trong trò chơi, khi chúng ta muốn rút thẻ, trước tiên hãy vẽ hình ảnh đen mờ với sự pha trộn nhân (hoặc alpha), bù theo một số hướng một chút, sau đó rút thẻ lên trên đó. Voilá.

Để biết thêm, bạn có thể xen kẽ giữa bóng và kết xuất thẻ để có hiệu ứng như (d) hoặc trước tiên vẽ tất cả các bóng và sau đó là các thẻ, như trong (e) (Tôi tô màu các thẻ trong trường hợp (e) để cho thấy rằng chúng vẫn còn riêng biệt =)

Tốt nhất là không sử dụng màu đen thuần túy (hoặc alpha đầy đủ) cho bóng để tạo ra các bóng trong suốt, tinh tế hơn.


2
+1 để làm bóng tối ra khỏi trò chơi. Bạn cũng có thể tiến thêm một bước và sửa đổi nơi bóng được đặt nếu có ánh sáng trong cảnh.
FrenchyNZ

+1, minh họa đẹp. Hơn nữa, trong trường hợp E, bạn có thể sử dụng kết xuất bóng tối trên bàn và bán sáng trên thẻ bằng stprint. Điều đó sẽ phức tạp hơn, nhưng hiệu ứng sẽ còn đẹp hơn :)
Kromster nói hỗ trợ Monica

2

Cái đầu tiên không quá khó. Nếu bạn kết xuất kênh alpha cho thẻ bài của mình (có thể đơn giản như màu đen đối với pixel có thẻ trong đó và màu trắng trong suốt), bạn có thể thực hiện bất kỳ loại mờ nào bạn muốn chỉ trên kênh alpha và sau đó bù lại và sử dụng nó để điều khiển ánh sáng của bảng. (Có lẽ, nếu bạn không có bộ đệm Z, trước tiên bạn phải hiển thị màn hình tắt kênh alpha ở đâu đó, sau đó thực hiện bảng với mặt nạ, sau đó kết xuất thẻ thực tế.)

Cái thứ hai trông hơi giống SSAO (tắc xung quanh không gian màn hình). Kỹ thuật đó đòi hỏi tọa độ Z. Tuy nhiên, nếu bạn không có các góc khác nhau giữa các thẻ (đó là những gì tôi đoán nếu bạn không có bộ đệm Z), có lẽ bạn có thể thực hiện xấp xỉ khá tốt bằng cách hiển thị một bóng đổ (như bóng đầu tiên) cho mỗi thẻ Thẻ. Hiệu suất có thể hơi khó, mặc dù mỗi máy bay sẽ cần một kênh alpha mờ cho tất cả các mặt phẳng phía trên nó, và nếu có một loạt các thẻ trên bàn, đó có thể là một vài đường chuyền kết xuất.


SSAO là quá mức cần thiết =) Rất khó để nói kỹ thuật tạo bóng nào được sử dụng mà không xem ví dụ hoạt hình. Nếu các thẻ luôn rơi theo thứ tự đó và cách nhau lên nhau, thì đơn giản nhất là chỉ cần kết xuất lại bóng trong, nhưng bạn sẽ không bao giờ biết khi thấy trò chơi hoạt động.
Patrick Hughes

0

Bạn có thể không làm một bản đồ bóng tối? Kết xuất cảnh cho một fbo. Chỉ lưu các giá trị độ sâu và thực hiện kiểm tra giá trị độ sâu thông thường trong trình đổ bóng để xem có nên hiển thị bóng hay không.


Tôi không sử dụng Z Buffer, không có 'độ sâu'.
jmasterx

0

Quá trình sau đây không yêu cầu mục tiêu kết xuất ngoài màn hình. Tuy nhiên, làm như vậy, nó đạt được yêu cầu bảng được vẽ trước . Hoặc ít nhất, không có gì được vẽ trên các pixel mà bảng sẽ che trước khi bảng được vẽ. Nó cũng yêu cầu bản thân bảng phải là một, một mảnh duy nhất, không chồng chéo: một hình ảnh.

Ngoài ra, bộ đệm khung của bạn cần một thành phần alpha.

  1. Lấy một hình ảnh thang độ xám của một thẻ. Làm cho nó mờ xung quanh các cạnh, có thể mở rộng kích thước của nó. Đây là hình ảnh thẻ bóng của bạn. Lưu ý rằng đây là hình ảnh một kênh. Khi bạn truy cập vào kết cấu này trong trình đổ bóng của mình, bạn nên đảm bảo rằng bạn đặt giá trị đơn trong thành phần alpha. Điều này có thể được thực hiện trong shader của bạn hoặc ở một nơi khác.

    Giá trị 0,0 trong ảnh có nghĩa là không có bóng. Giá trị 1.0 trong ảnh có nghĩa là tổng bóng . Đó là, hoàn toàn tối đen. Bạn có thể muốn một giá trị 0,5 hoặc hơn như là màu tối nhất của bạn.

  2. Xóa màn hình sao cho alpha được đặt thành không .

  3. Trước khi kết xuất bất cứ thứ gì (hoặc ít nhất là bất cứ thứ gì sẽ được hiển thị "bên dưới" bảng), đối với mỗi thẻ, hãy hiển thị kết cấu mờ, bù vào vị trí thực tế của thẻ (nhưng có cùng hướng). Đầu ra màu của trình đổ bóng phải là Cấu hình pha trộn cho điều này phải là (theo cách nói OpenGL):

    glBlendEquation(GL_MAX);

    Chế độ hòa trộn này được sử dụng để giữ cho các bóng chồng chéo không bị tối hơn hoặc sáng hơn. Nó chỉ đơn giản là lấy giá trị tối nhất được ghi vào pixel đó. Nó sẽ trông đủ tốt.

    Bạn cũng nên sử dụng mặt nạ ghi màu để tắt ghi màu.

  4. Kết xuất bảng. Khi làm như vậy Việc trộn phải được thiết lập như sau:

    glBlendEquation(GL_ADD);
    glBlendFunc(GL_ONE_MINUS_DST_ALPHA, GL_ZERO);

Nếu các hạn chế quá hạn chế đối với bạn, thì bạn phải sử dụng mục tiêu kết xuất. Điều này được thực hiện như sau:

  1. Tạo hình ảnh thẻ bóng như trước.

  2. Đầu tiên, làm cho bóng tối. Ràng buộc bộ đệm khung bóng (chỉ cần là hình ảnh một kênh, nếu phần cứng của bạn có thể kết xuất với một trong số đó). Xóa giá trị của nó bằng không.

  3. Đối với mỗi thẻ, hiển thị hình ảnh thẻ bóng, bù như trước. Trình tạo bóng của bạn nên ghi cùng một giá trị cho cả bốn thành phần của màu đầu ra. Chế độ pha trộn một lần nữa nên được glBlendEquation(GL_MAX).

  4. Chuyển về bộ đệm khung thông thường. Vẽ mọi thứ bạn muốn được làm bóng.

  5. Bây giờ, vẽ một hình tứ giác toàn màn hình với hình ảnh bóng mà chúng tôi đã kết xuất. Trình tạo bóng sẽ lưu trữ texel được tìm nạp từ hình ảnh bóng trong alpha của đầu ra; RGB không liên quan. Chế độ hòa trộn phải là:

    glBlendEquation(GL_ADD);
    glBlendFunc(GL_ZERO, GL_ONE_MINUS_SRC_ALPHA);

Trong phương pháp đầu tiên, tôi nghĩ bạn đã quên bước 5: vô hiệu hóa pha trộn và kết xuất thẻ. Ngoài ra, điều đáng chú ý là phương pháp đầu tiên không cho phép bạn có được bóng giữa các thẻ như trong ảnh chụp màn hình thứ hai của OP.
Nathan Reed

@NathanReed: Tôi hình dung anh ấy biết cách tự tắt mọi thứ. Ngoài ra, "bóng giữa các thẻ" không có ý nghĩa gì, như tôi đã chỉ ra trong nhận xét của mình dưới câu hỏi.
Nicol Bolas

1
Nó có thể không thực sự đại diện cho cách bạn thực sự giữ thẻ, nhưng nó trông thật tuyệt! Sẽ không thực sự "có ý nghĩa" khi các lá bài nổi lên trên bàn như chúng làm trong lần bắn đầu tiên, hoặc ...
Nathan Reed

0

Tôi sẽ sử dụng bộ đệm stpson. Xóa nó thành 1 (tốt nhất là cùng lúc với độ sâu bạn xóa), vẽ bảng của bạn. Sau đó kích hoạt kiểm tra stprint, vẽ bóng bằng cách sử dụng kết cấu hình chữ nhật mờ, tăng nếu stprint và độ sâu vượt qua, không làm gì nếu stprint thất bại, không có gì nếu độ sâu thất bại và đặt func của bạn thành GL_EQUAL (ref 1, mask 0xff), vô hiệu hóa kiểm tra stprint . (Tôi chưa kiểm tra đầy đủ điều này nhưng nó bắt nguồn từ mã tương tự và sẽ hoạt động tốt; bạn có thể cần phải điều chỉnh các thông số). Sau đó vẽ mọi thứ khác.

Các cuộc gọi sẽ là:

glEnable (GL_STENCIL_TEST);
glStencilFunc (GL_EQUAL, 1, 2);
glStencilOp (GL_KEEP, GL_KEEP, GL_INCR);

// draw shadow textures

glDisable (GL_STENCIL_TEST);

Lần duy nhất điều này có thể gây rắc rối là nếu bạn có hai cạnh mờ mờ chồng lên nhau một chút; mặt khác, nó không cần gì ngoài những gì OpenGL 1.1 cơ bản cung cấp và sẽ hoạt động trên tất cả các phần cứng (có thể mong đợi các thẻ 3DFX cũ, mà tôi cho rằng bạn không thực sự lo lắng về việc hỗ trợ ...)

Một lựa chọn thứ hai, sẽ hoạt động rất tốt trong một trò chơi không quan trọng về hiệu năng, là glCopyTexSubImage2D. Điều đó cũng sẽ hoạt động với kết cấu nhỏ hơn backbuffer và cũng được hỗ trợ tốt trên tất cả các phần cứng (đó là một phần của OpenGL 1.1 và Doom 3 đã sử dụng nó, vì vậy bạn có thể mong đợi hỗ trợ rất tốt).

Các thiết lập cơ bản sẽ như thế này:

  • Xóa màu thành màu đen.
  • Vô hiệu hóa ghi sâu (mặc dù phương pháp này không cần bộ đệm độ sâu, vì vậy bạn có thể bỏ qua phần đó vì bạn không sử dụng bộ đệm).
  • Đặt chế độ xem cùng kích thước với kết cấu của bạn.
  • Vẽ thẻ như hình học đầy màu trắng.
  • glCopyTexSubImage2D cho kết cấu của bạn.
  • Chuyển chế độ xem trở lại kích thước cửa sổ đầy đủ.
  • Vẽ bảng như bình thường.
  • Vẽ kết cấu như một quad pha trộn toàn màn hình, sử dụng một shader để làm mờ nó và đảo ngược màu sắc.
  • Vẽ mọi thứ khác.

Điều đó cũng hoạt động rất tốt, nó chuyên sâu hơn GPU một chút so với phương pháp đệm stpson nhưng xử lý trường hợp chồng chéo một cách chính xác và - như tôi đã nói - Tôi nghĩ rằng một trò chơi như trò chơi của bạn sẽ có sức mạnh GPU, ngay cả ở cấp thấp Thẻ.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.