--- title: 以下を追加中: フォロワーリスト機能 slug: world-sdk-guide-ja/p6EHg2EvN7_haVbcYUqmr docTags: createdAt: 2024-09-02T08:34:13.135Z --- ZEPETO.ModuleのソーシャルAPIを使用すると、ワールドクリエイターはユーザーの友達リストを読み込むことができます。 ワールドクリエイターは、新しいユーザーをフォローしたり、フォローしたユーザーのフォローを解除したりすることもできます。 ## インストール方法 まず、Window → パッケージマネージャー → ZEPETO.Worldパッケージのバージョン1.21.0以上をインストールしてください。 次に、ZEPETO.Moduleパッケージをインストールします。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-Wz2C2dqGFGqCbVVSSIPMd-20240904-102425.png) ## ポップアップ友達リストプレハブの使用 ZEPETO.Moduleパッケージは、フォローリストやフォロワーリストを簡単に作成するためのUIプレハブを提供します。 1\) プロジェクトパネルで、パッケージ > ZEPETO.Module > ソーシャル > ランタイム > UI > \_Resources > プレハブフォルダーに移動します。 2\) フォルダー内のプレハブの中から、FollowScrollView\.prefabをシーンにドラッグ＆ドロップします。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-O4iKxlFAR1PnhIB3tihQo-20240904-102425.png) :::hint{type="danger"} **❗️ 注意** EventSystemオブジェクトがシーンに存在しない場合、この機能は正しく動作しない可能性があります。GameObject > UI > EventSystemに移動してオブジェクトを追加してください。 ::: 3\) 再生ボタンをクリックして、友達リストのポップアップが画面に表示されるのを確認します。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-wuTuSReoqVNrJL8dKL9Be-20240904-102424.png) - 友達リストポップアップを作成するFollowScrollView\.prefabは、FollowScrollViewコンポーネントを使用して、画面に友達リストと総ユーザー数を読み込み、表示します。 - FollowScrollViewコンポーネントに設定された情報は以下の通りです。 ### Follow Scroll Viewコンポーネント | 1 | 高さ | スクロールビュー内のユーザー情報セル間の垂直距離の値 | | - | ------------ | ----------------------------------------------------------------------------- | | 2 | ロードカウント | セルロードカウント：スクロールビューがスクロールされたときにロードされるセルデータの数。この値を高く設定すると、ロード速度に影響を与える可能性があります。 | | 3 | ユーザー情報プレハブ | ユーザー情報を表示するための個々のセル用のUIプレハブ | | 4 | トータルカウントプレハブ | 総ユーザー数を表示するプレハブ。テキストは自動的に翻訳され、複数の言語で表示できます。 | | 5 | キャンバススケーラー | 友達リストUIのキャンバス外観を選択できます。事前に作成されたキャンバスを使用できます。 | | 6 | 垂直 | フォロービューコントローラーを含む垂直画面UIプレハブを登録します。 | | 7 | 水平 | フォロービューコントローラーを含む水平画面UIプレハブを登録します。 | | 8 | 背景 | 友達リストUIが表示されるときに表示される半透明の黒い画面 | ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-Rs2UaG2rdrjme7GvMZ7Ci-20240904-102424.png) 友達リストがFollowScrollViewを通じて生成されるとき、世界の画面が横向きモードの場合、FollowScrollView\_Landscapeが適用されます。 - 画面が縦向きモードの場合、FollowScrollView\_Portraitが適用されます。 - FollowScrollView\_LandscapeおよびFollowScrollView\_Portraitに適用されるFollowView Controllerコンポーネントで構成された情報は以下の通りです。 ### フォロービューコンポーネント | 1 | フォロワータブ | フォロワータブグループ | | -- | ---------- | ----------------------------------- | | 2 | フォロー中タブ | フォロー中タブグループ | | 3 | スクロールバー | 友達リストのスクロールビュー | | 4 | 空の画像 | 友達リストが空のときに表示される画像 | | 5 | ローディングスピナー | 友達リストが読み込まれている間に表示される画像 | | 6 | 閉じるボタン | 友達リストポップアップを閉じるためのボタン | | 7 | タイトル | 友達リストポップアップのタイトル | | 8 | フォロワー | フォロワーパネルのアクティブ/非表示状態を表示するためのボタンテキスト | | 9 | フォロー中 | フォロー中パネルのアクティブ/非表示状態を表示するためのボタンテキスト | | 10 | 空のテキスト | 友達リストが空のときに表示されるテキスト。 | | 11 | パネル | 全体UIパネル | ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-f_av14jLQGwf9i4eoDQKa-20240904-102425.png) 以下に示すように、友人情報が表示されるセルには、フォローメセルビューとユーザー情報セルビューのコンポーネントが適用されています。それぞれのコンポーネントの情報は次のとおりです。 ### ユーザー情報セルビューコンポーネント | 1 | ビュー名 | ユーザー名テキスト | | - | ----------- | ---------------- | | 2 | プロフィールを見る | ユーザープロフィール画像 | | 3 | フォローボタン | ユーザーをフォローするボタン | | 4 | アンフォローボタン | ユーザーをアンフォローするボタン | | 5 | バッジを見る | バッジアイコン画像 | | 6 | グリーターバッジを見る | グリーターアイコン画像 | | 7 | フォローを見る | フォローボタンテキスト | | 8 | フォロー中を見る | アンフォローボタンテキスト | ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-wgpc9WgekaAgCz8nEB1NY-20240904-102425.png) :::hint{type="success"} 👍 **ヒント** - ZEPETOテキストはUnityEngine\_UI.Textを継承し、世界内のUIの利便性のためにいくつかの追加機能を提供します。テキストはFollowScrollView Prefab編集モードで簡単に編集できます。 - ユーザー名の横に表示されるバッジアイコンは、ZEPETOクリエイターやグリーティングなどの特別なユーザーを示すために使用されるアイコンです。 ::: ## 友達リストポップアッププレハブUIの変更 UI要素を変更することで友達リストをカスタマイズできます。 Packages内のプレハブを選択し、Assetsフォルダにドラッグ＆ドロップしてプレハブをコピーします。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-ld8TafVCthzl4LCNJOgBE-20240904-102425.png) :::hint{type="success"} **👍 ヒント** プレハブはPackagesフォルダ内では変更できませんが、Assetsフォルダのサブフォルダにコピーされると変更できます。 :::