如何自定义代码块（Code Block）样式

[resetsix]

如图所示，MarkdownView貌似是为 macOS 优先设计，在移动端中的 Table header 和 body 间距看上去要大一些且比较固定，不能灵活修改。(我尝试寻找MarkdownView相关的markdown、table 修饰符但是没找到)。所以希望能够自定义Table header 和 body 的 padding 和 background。

[LiYanan2004]

这个是 Code Block 吧 貌似不是 Table

Code Block 是支持自定义的

[resetsix]

Code Block 是支持自定义的

感谢回复。我对.codeBlockStyle自定义Table样式的用法不是很熟悉（刚学习 Swift 几个月），我去查阅了codeBlockStyle文档也是有些一头雾水。

不知道该如何定义 header 和 body 的 padding 与 background。希望能得到您的解惑谢谢。

[LiYanan2004]

@resetsix 你所谓的 Table 是这个嘛？还是哪一块？你的截图中其实没有出现 Table

[resetsix]

@resetsix 你所谓的 Table 是这个嘛？还是哪一块？你的截图中其实没有出现 Table

对的是代码块，抱歉没有阐述清楚。

代码块的 header 与 body

[LiYanan2004]

代码块的 header 与 body

这里没有 header 和 body 的概念 就是一个块

@resetsix 自定义代码块需要自定义一个 Style 类型 然后遵循 CodeBlockStyle 协议

参考

• DefaultCodeBlock （在项目里有源码）
• SwiftUI.ButtonStyle
  • 这部分设计和 SwiftUI 一致 可以自行搜索一下

[resetsix]

@LiYanan2004 好的谢谢，我研究一下。

[resetsix]

@LiYanan2004 你好我想请教一下，为什么 .markdownBlockStyle(\.codeBlock) { configuration in定义方式前者生效后者不生效呢？

前者是swift-markdown-ui

Markdown(data)
    // .markdownTheme(.gitHub)
    .markdownBlockStyle(\.codeBlock) { configuration in
        configuration.label
            .padding()
            .background(Color.pink)
}

MarkdownView(data)
    // .markdownTheme(.gitHub)
    // .markdownMathRenderingEnabled()
    .markdownBlockStyle(\.codeBlock) { configuration in
        configuration.label
            .padding()
            .background(Color.pink)
}

---

补充：我才发现文档里没有.markdownBlockStyle这个属性 :(

[LiYanan2004]

这就不是我的库里的东西啊 怎么可能生效

[resetsix]

文件导了多个 markdown 的库写demo，xcode类型提示串味了

[LiYanan2004]

这个本身没有问题 因为这些方法全是扩展到SwiftUI.View 上的