Elm

Elm 代码截图生成器

不必离开 Mac,就能把 Elm 代码片段变成值得分享的图片。

Elm 的类型标注单独占一行,位于每个函数上方,这让代码有了辨识度很高的形状,在画框里很好读。

Codeshot 会根据你粘贴的代码识别 Elm,不存在选错语言的问题。下面是同一段代码在内置 30 款主题中的三款下的效果,由应用自身的样式表渲染。

module Snapshot exposing (export)

type alias Options =
    { theme : String
    , scale : Int
    }

export : String -> Options -> Result String String
export code options =
    code |> render options.theme |> save options.scale
Atom One · 深色
module Snapshot exposing (export)

type alias Options =
    { theme : String
    , scale : Int
    }

export : String -> Options -> Result String String
export code options =
    code |> render options.theme |> save options.scale
GitHub · 深色
module Snapshot exposing (export)

type alias Options =
    { theme : String
    , scale : Int
    }

export : String -> Options -> Result String String
export code options =
    code |> render options.theme |> save options.scale
Solarized · 深色

为 Elm 选择主题

把标注和它的函数放在一起。用裁切把两者分开,等于删掉了整段代码里信息量最大的一行。

把尺寸定对

让图片随内容自适应,或锁定一个比例——1:1、4:3、3:2、16:9、9:16、2:3 或 3:4——然后以 1×、2× 或 3× 导出,在 Retina 屏上依然清晰。用 C 直接复制到剪贴板,或用 S 保存。

查看全部 30 款主题对比,或阅读完整流程

为 Elm 以及另外 59 种语言打造

一切都在你的 Mac 上完成,代码不会外传。

下载