> ## Documentation Index
> Fetch the complete documentation index at: https://docs.sequence.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# チェックアウトUI

SDKにはデフォルトのチェックアウトUIが付属しており、ゲームに合わせてカスタマイズしてご利用いただくことをおすすめします。

## 組み込みチェックアウトUIの利用

`CheckoutPanel`は、Boilerplatesアセンブリの一部としてご用意しています。他のボイラープレートと同様に、`BoilerplatesFactory`からアクセスできます。詳細は[ゲームのブートストラップ](/sdk/unity/bootstrap)をご覧ください。

概要として、`Assets/**/Resources/Checkout/CheckoutPanel`にある`CheckoutPanel`プレハブを使い、`BoilerplateFactory`を通じて簡単に開くことができます。

```
(CheckoutPanel, CheckoutPage) checkoutUi = BoilerplateFactory.OpenCheckoutPanel(parentTransform, checkoutHelperInstance, fiatCheckoutInstance, optionalOnCloseAction);
```

ここでcheckoutHelperInstanceは`ICheckoutHelper`インターフェース、fiatCheckoutInstanceは`IFiatCheckout`インターフェースを実装しています。

現在、`ICheckoutHelper`には「NftCheckout」と「ERC1155SaleCheckout」の2つの実装があり、それぞれセカンダリセールスのマーケットプレイスとERC1155の一次販売に対応しています。ERC721の一次販売用実装も近日中に追加予定です。

`SequenceCheckout`は現在唯一の`IFiatCheckout`実装で、セカンダリセールスのマーケットプレイスとERC1155の一次販売の両方に対応しています。ERC721の一次販売対応も今後追加予定です。

## 仕組みについて

独自のチェックアウトパネルやモーダルロジックを構築したい場合など、チェックアウトの仕組み全体を理解しておくと役立ちます。

この図は、システムの構成を理解するのに役立ちます。

<img src="https://mintcdn.com/sequence-0fb8d9e6/P54GoXc5KxoCAtL8/images/unity/ERG_SequencePayModal.png?fit=max&auto=format&n=P54GoXc5KxoCAtL8&q=85&s=5c05b3e54f4c1b5e79cb36fe688ab084" alt="ERG Diagram" width="2359" height="1233" data-path="images/unity/ERG_SequencePayModal.png" />

[出典](https://github.com/0xsequence/sequence-unity/blob/Feature/marketplaceCheckout/Packages/Sequence-Unity/Sequence/SequenceSDK/Marketplace/ERG_CheckoutModal.mmd)

この図や`CheckoutPage`（および関連する）ソースコードは、独自のUIロジックを作成する際の参考資料としてご活用いただけます。