ホームへ戻る
/
アップロードボタン5529
Riveを初期化中...

使用ドキュメント

ガイド

🙋🏻‍♂️ Riveファイルの使用方法

Riveエディターにインポートして自由に編集し、必要に応じて変更して.rivファイルをエクスポートして使用します。

🎯 基本ロジック

ステートマシンプレビューを開始後、クリック変化効果を実現;進捗制御時、バインドされたステートデータの数値を手動で調整して進捗制御のプレビューを実現;対応する進捗数値が100に達すると自動的にステートを切り替えて変化します。

🎁 .rivファイルエクスポート時の注意

フォントを変更して.rivファイルサイズを削減する場合、以下の設定に注意してください:

対応するフォントを見つけ、エクスポート設定で「使用されたグリフ」を選択します—これにより使用された文字のみがエクスポートされ、.rivファイルサイズを大幅に削減できます。

🥳 Riveファイル使用の要点

✍🏼 Rive初期化設定

stateMachines: "main" autoBind: true (他の設定は未設定またはデフォルトを使用可)

💥 データフィールドのバインド

  • isHover ブール型:マウスがボタン上にホバーするとtrueに設定され、ホバーしない場合はfalse。
  • isClicked ブール型:ボタンクリック後、値がtrueに設定され、クリック前はfalse。
  • progressNum 数値型:進捗変化数値を制御し、範囲は0-100に設定;値が100に達するとボタンが自動的に次のステートに変化します。

🚀 高度なテクニックと公式リソース

  • 本ケースのステートマシンとフィールド説明をAIに提供して、対応するランタイム初期化とインタラクションコードテンプレートを生成し、プロジェクト構造に基づいて調整します。
  • バインドが無効な場合、まずstateMachines名、フィールド名、および型が一致するか確認してください。
  • 公式ランタイムドキュメント:https://rive.app/docs/runtimes/

使用ドキュメントをすべてアンロック

実装の詳細、ステートマシンの設定などが含まれます。

進捗管理変形効果

アップロードボタン5529

$3usd

買い切りプラン · 永久アクセス

含まれるリソース:
.riv ランタイムファイル
.rev プロジェクトファイル
使用ドキュメント

対応プラットフォーム

WebiOSmacOSAndroidFlutterReact NativeFramerWebflowWixDefoldUnityUnrealC++

仕様

アートボードサイズ
220x80 px
.riv ランタイムリソース
587.2 KB
機能
マウスがボタン上にホバーしているかを検出します
ボタンがクリックされたかどうかを検出
プログレスバーの進行を制御可能
.rev 編集可能ソース
893.9 KB
使用されている機能
Data Binding
Listeners

あなたへのおすすめ

UI COMPONENTS
ID 1024
ダウンロードボタン
#進捗管理#変形効果
ライブプレビュー
UI COMPONENTS
ID 7803
ダウンロードボタン
#進捗管理#変形効果
ライブプレビュー
UI COMPONENTS
ID 2346
ダウンロードボタン
#進捗管理#モーフィング
ライブプレビュー