Signature_pad: 100％幅で操作するにはどうすればよいですか？

もっと明確にしてください…

もっと明確にしてください…

ハンドヘルドを考えて帆布を作りましたが、幅は完璧でした。

しかし、彼らはタブレットを使うことに決めたので、幅は狭くなりました。

画像を参照してください：

署名画面を任意の画面サイズ（幅100％）に応答させる方法。

ありがとうございました。

（あなたの画像が見えません）
デモコードはタブレットで機能しましたか？

同じ問題があります。
モバイル画面でキャンバスの幅を100％、高さを100％に設定しました
その後、キャンバスが正しく機能しません

口で言うだけなら簡単です。 コードを見せてください。

divラップcanvasます。 次に、 ResizeObserverを使用してdivサイズ変更を聞きます。 canvas渡します。

複雑ですが、機能しました。 react-use useMeasureを使用します。 下記参照：

import React from 'react'
import { useMeasure } from 'react-use'

export default () => {
    const [containerRef, { width, height }] = useMeasure();

    return (
        <div ref={containerRef} style={{ width: '100%', height: '100%' }}>
            <canvas width={width} height={height} />
        </div>
    )
}