如何将渐变组件添加到自定义图块

时间：2020-11-03 作者：kanlukasz

我在古腾堡手册中找不到任何有用的信息。Here 是有关添加渐变的信息，但它仅适用于某些核心块。

我使用ColorPalette 创建颜色（或使用颜色选择器），但仍然不知道如何使用渐变。我还发现PanelColorSettings 但仍然没有成功。

我正在寻找有关如何添加此组件的说明/文档：

enter image description here

2 个回复
最合适的回答,由SO网友:Tom J Nowell 整理而成

The documentation for that control does not exist at this time. Instructions have not been written yet. It is an experimental component.

您需要在块编辑组件中使用适当的控件。

请注意，这些都是非常新的组件，它们的设计可能会发生变化，应将其视为实验性的和不稳定的。

这里有GradientPicker 组成部分https://github.com/WordPress/gutenberg/blob/master/packages/components/src/gradient-picker/index.js

和ColorGradientControl https://github.com/WordPress/gutenberg/blob/26e4d59e6fd3ed78d0213d60abca31c6dc1fa9cb/packages/block-editor/src/components/colors-gradients/control.js

        <ColorGradientControl
            { ...otherProps }
            onColorChange={ onChange }
            colorValue={ value }
            gradients={ [] }
            disableCustomGradients={ true }
        />

SO网友:Jean-Philippe Belley

我找到了对自定义块的支持，它真的很有帮助。

supports: {
    color: {
        // This also enables text and background UI controls.
        gradients: true; // Enable gradients UI control.
    }
}

https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/

标签： plugin-development   block-editor   小码农  

相关推荐