3

我正在 Elm 中写一个roguelike ，其中有一个离散的 50x50 网格（请参阅share-elm.com 片段）。roguelike 是一种视频游戏，其中对象（如敌人、物品、墙壁等）由 ASCII 字符表示。因此，我应该能够将数百个不同的 ASCII 字符排列在一个矩形网格中。每个字符都应严格位于其网格单元内。

为了创建这个网格，我将每个角色放在一个正方形中container（实际游戏容器的 1/50 大小）。这意味着我最多可以在游戏中拥有 2500 个容器。Elm<div>为容器创建元素，即使我将这些容器转换Form为collage. 这使我的 Firefox 39.0 的性能非常缓慢。

如何在其网格单元格中创建一个具有良好对齐的 ASCII 字符（可能还有其他一些图形元素）的矩形网格，以便无论我同时拥有多少元素，拼贴仍然保持快速响应？每次我在拼贴中编写一个包含大量容器和其他元素的程序时，一般的惯用方法是什么？或者也许有一种完全不同的方法可以在 Elm 中创建活泼的矩形网格？

4

2 回答 2

1

您在这里寻找的是Graphics.Collage.text. 当您将 anElement变成FormElm 时，将采用可以放置任何Element 类似a的通用方法Form，但它实际上并没有在画布上绘制它。（是的，实施细节）。如果您直接从Textto Form，则静态知道它是文本，因此可以使用在画布上绘制文本的更快方法。这是一个简单的改变：

view : (Int, Int) -> Element
view (w,h) =
  let
    s = min w h -- collageSize
    forms = List.map (\(x,y) -> move (s,s) (x,y) playerForm)
               <| cartesian 0 (screenSize-1) 0 (screenSize-1)
    playerForm = "@"
               |> Text.fromString
               |> Text.height ((toFloat s) / screenSize)
               |> C.text
             --  |> E.centered
             --  |> E.container (s//screenSize) (s//screenSize) E.middle
             --  |> C.toForm
  in
    E.color Color.lightGray
       <| E.container w h E.middle
            <| E.color Color.white
                 <| C.collage s s forms

而不是评论中的三行，它只是C.text. 您可以在更新后的 share-elm 片段中看到响应能力。
请注意，您不能再选择文本！但否则它应该会好得多。

于 2015-08-09T23:10:28.117 回答
1

一种可能性（如果您不介意编写一些 HTML 而不是使用collage/ container）是使用该Html.Lazy模块。例如，您可以将显示的每个“行”的渲染包装在 a 中lazy，它只会重新渲染更改的行（每个时间步长/移动应该只有 1-2 个）。

于 2015-08-09T19:08:12.963 回答