README

redtally.field_type.signature

签名垫字段类型。

Screenshot

签名字段类型提供基于 signature_pad 的 HTML5 canvas 签名输入。

安装

composer require redtally/signature-field_type 或在您的 composer.json 文件中添加 redtally/signature-field_type: "~1.0.0"。

配置

以下是带有默认值的完整配置。

"example" => [
    "type"   => "redtally.field_type.signature",
    "config" => [
        "mode"                      => "database",
        "canvas_width"              => 480,
        "canvas_height"             => 320,
        "dot_size"                  => null,
        "min_width"                 => 0.5,
        "max_width"                 => 2.5,
        "throttle"                  => 16,
        "min_distance"              =>  5,
        "background_color"          => "#ffffff",
        "pen_color"                 => "#000000",
        "velocity_filter_weight"    => 0.7
    ]
]

键	示例	描述
mode	database	字段类型的存储模式。
canvas_width	480	画布宽度（签名垫需要固定宽度才能正确渲染）。
canvas_height	320	画布高度（签名垫需要固定宽度才能正确渲染）。
dot_size	2.0	点的大小。保留默认值以允许签名垫确定。[签名垫选项]
min_width	1.0	线条的最小宽度。[签名垫选项]
max_width	3.0	线条的最大宽度 [签名垫选项]
throttle	10	每 x 毫秒最多绘制一次下一个点。将其设置为 0 以关闭节流。
min_distance	6	只有当上一个点比 x 像素远时才添加下一个点。[签名垫选项]
background_color	#f6f6f6	用于清除背景的颜色。[签名垫选项]
pen_color	#d5d5d5	用于绘制线条的颜色。[签名垫选项]
velocity_filter_weight	1.0	用于根据先前速度修改新速度的权重。[签名垫选项]

使用方法

设置值

以编程方式设置字段值需要 JSON 编码的 canvas 点数组。例如

$example->signature = "[[{"x":124.5,"y":67.20001220703125,"time":1519873747894,"color":"black"}]]";

基本输出

字段类型返回的默认值将是 canvas 点的 JSON 编码数组。

$example->signature; // "[[{"x":124.5,"y":67.20001220703125,"time":1519873747894,"color":"black"}]]"

展示者输出

本节将展示 Redtally\SignatureFieldType\SignatureFieldTypePresenter 类提供的方法。

SignatureFieldTypePresenter::base64()

此方法返回签名的 base64 编码字符串版本。

返回 string

参数

键	必需	默认	描述
$width	false	字段配置值 `canvas_width`	返回图像的宽度。
$height	false	字段配置值 `canvas_height`	返回图像的高度。

示例

$decorated->signature->base64(); returns data:base64,...

{{ $decorated->signature->base64 }}

SignatureFieldTypePresenter::image()

此方法返回填充画布的 \Intervention\Image\Image 实例。

返回 \Intervention\Image\Image

参数

键	必需	默认	描述
$width	false	字段配置值 `canvas_width`	返回图像的宽度。
$height	false	字段配置值 `canvas_height`	返回图像的高度。

示例

$decorated->signature->image(); returns data:base64,...

{{ $decorated->signature->image->encode('jpg', 75) }}

redtally / signature-field_type

维护者

详细信息