--- title: スクリーンショット slug: world-sdk-guide-ja/bs5rsS1hRA2_jfNwE5jFH docTags: createdAt: 2024-09-02T08:34:13.135Z --- ## スクリーンショット機能の使用 ZepetoWorldContent APIの画像関連機能を使用して、ワールド内で画像を保存または共有し、フィードに画像を投稿できます。 ZepetoWorldContent APIは、以下の画像関連機能を提供します。 | **API** | **説明** | | --------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- | | ZepetoWorldContent.SaveToCameraRoll(rt: UnityEngine.RenderTexture, result: System.Action$1) | 画像をフォトライブラリに保存します。 | | ZepetoWorldContent.SaveToCameraRoll(texture: UnityEngine.Texture2D, result: System.Action$1) | 画像をフォトライブラリに保存します。 | | ZepetoWorldContent.Share(rt: UnityEngine.RenderTexture, result: System.Action$1) | 画像を外部アプリに共有します。 | | ZepetoWorldContent.Share(texture: UnityEngine.Texture2D, result: System.Action$1) | 画像を外部アプリに共有します。 | | ZepetoWorldContent.CreateFeed(rt: UnityEngine.RenderTexture, contents: string, result: System.Action$1) | 画像をフィードにアップロードします。投稿の内容は第二引数で指定できます。ワールドタグは自動的に適用され、フィードに投稿されます。 | | ZepetoWorldContent.CreateFeed(texture: UnityEngine.Texture2D, contents: string, $result: System.Action$1) | 画像をフィードにアップロードします。投稿の内容は第二引数で指定できます。ワールドタグは自動的に適用され、フィードに投稿されます。 | 以下は、ZepetoWorldContent内で画像機能を呼び出す例です。 ```typescript ZepetoWorldContent.SaveToCameraRoll(this.renderTexture, (result: boolean) => {console.log(`保存結果 : ${result}`)}); ZepetoWorldContent.SaveToCameraRoll(this.texture2D, (result: boolean) => {console.log(`保存結果 : ${result}`)}); ZepetoWorldContent.Share(this.renderTexture, (result: boolean) => {console.log(`共有結果 : ${result}`)}); ZepetoWorldContent.Share(this.texture2D, (result: boolean) => {console.log(`共有結果 : ${result}`)}); ZepetoWorldContent.CreateFeed(this.renderTexture, "[コンテンツ]", (result: boolean) => {console.log(`フィード作成結果 : ${result}`)}); ZepetoWorldContent.CreateFeed(this.texture2D, "[コンテンツ]", (result: boolean) => {console.log(`フィード作成結果 : ${result}`)}); ``` 以下は、RenderTextureを使用したZepetoWorldContentのスクリーンショットモードの関数を使用した例コードです。 ```typescript import { Camera, RenderTexture } from 'UnityEngine'; import { Button, Text } from 'UnityEngine.UI'; import { SpawnInfo, ZepetoPlayers } from 'ZEPETO.Character.Controller'; import { ZepetoScriptBehaviour } from 'ZEPETO.Script'; import { WorldService, ZepetoWorldContent } from 'ZEPETO.World'; export default class ZepetoWorldContentExample extends ZepetoScriptBehaviour { // ZepetoWorldContent スクリーンショット UI public cameraRenderButton: Button; public saveToCameraRollButton: Button; public shareButton: Button; public createFeedButton: Button; public logText: Text; // レンダーカメラ private camera: Camera; // レンダーテクスチャ public renderTexture: RenderTexture; Start() { ZepetoPlayers.instance.CreatePlayerWithUserId(WorldService.userId, new SpawnInfo(), true); ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => { this.camera = ZepetoPlayers.instance.LocalPlayer.zepetoCamera.camera; }); this.cameraRenderButton.onClick.AddListener(() => { this.camera.targetTexture = this.renderTexture; this.camera.Render(); this.camera.targetTexture = null; }); this.saveToCameraRollButton.onClick.AddListener(() => { ZepetoWorldContent.SaveToCameraRoll(this.renderTexture, (result: boolean) => { this.logText.text = `保存結果 : ${result}`; }); }); this.shareButton.onClick.AddListener(() => { ZepetoWorldContent.Share(this.renderTexture, (result: boolean) => { this.logText.text = `共有結果 : ${result}`; }); }); this.createFeedButton.onClick.AddListener(() => { ZepetoWorldContent.CreateFeed(this.renderTexture, "[コンテンツ]", (result: boolean) => { this.logText.text = `フィード作成結果 : ${result}`; }); }); } } ``` :::hint{type="danger"} - Unityエディタモードではチェックできませんが、アプリでプレイしているときにチェックできます。 ::: ## スクリーンショット スクリーンショットモジュールはBuild it Unity Plug-inに含まれており、下記のGitHubでモジュールスクリプトを確認することができます。 :::hint{type="info"} **📘 Build it Unity Plug-inスクリーンショット·モジュール** - [GitHubリンク](https://github.com/Zepeto-TechEvangelist/zepeto_buildit_template/tree/main/Assets/BuilditTemplate/Modules/Screenshot) ::: ### スクリーンショット機能の使用方法 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/4Rpb5sZgIVWqvbAmf8Sl1_image.png) スクリーンショット機能は、Build it Unity Plug-in ワールドプレイ画面の右側に位置するカメラアイコンをクリックして使用することができます。 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/V7YuThj_-w-4Xeks2N7no_image.png) - **1：セルフィーモードボタン** - カメラをセルフィーモードに切り替えることができます。 - **2：写真撮影ボタン** - プレイ画面を撮影できます。 - **3：動画録画ボタン** - プレイ画面を録画できます。 - **4：出るボタン** - スクリーンショットモードから出ることができます。 :::hint{type="info"} ✏️ **ノート** - チャットの吹き出しは撮影できませんので、ご参考ください。 ::: ### 写真撮影 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/CICdW1SBZWxvkgfz6Ri0k_image.png) 写真撮影ボタンを押すと、上記のポップアップウィンドウが表示されます。 **Upload**ボタンを押すと、撮影された写真が私のZepetoフィードにすぐアップロードされます。 - 写真はスクリーンショットPrefabに設定された基本Descriptionテキストとともにフィードにアップロードされます。 基本テキストを変更する方法は[スクリーンショット Description テキストの変更方法](docId:6_buNlvcMsaJjFj6kKvHW) ガイドをご参照ください。 **Edit**ボタンを押すと、スクリーンショットをフィードにアップロードする前に投稿テキストを修正することができます。 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/eKl_3sXE3UKVjsr-UbJbE_image.png) - **1:共有ボタン** - スクリーンショットを共有できます。 - **2:ダウンロードボタン** - スクリーンショットを自分のデバイスに保存できます。 - **3:出るボタン** - Editモードに出ることができます。 - **4:写真プレビューウィンドウ** - 撮影されたスクリーンショットをプレビューできます。 - **5:ポストテキスト修正** - スクリーンショットとともに、Zepetoフィードにアップロードされるテキストを修正できます。 - **6: アップロードボタン** - スクリーンショットとテキストをZepetoフィードにアップロードできます。 ### 動画録画 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/Ct4S1AQ7k3wMlskR7gMJV_videorecording.gif) 動画録画ボタンを押すと録画が始まり、録画時間がディスプレイされます。 ### セルフィーモード ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/ZHHphNQ_nL5rj33BhpBT4_image.png) スクリーンショットアイコンをタップすると、セルフィーモードのアイコンが表示されます。 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/QztkKA5I6QqQWGX34BVBM_image.png) アイコンをタップすると、セルフィーモードを使用できます。 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/pO60oFZKyky9qY4_LKe-J_selfiemode.gif) セルフィーモードでは、キャラクターがカメラの方向を見ます。カメラが一定の角度以上に動くと、キャラクターは再び正面を向きます。 セルフィーモードが有効な状態で写真を撮ったり、動画を録画したりできます。 セルフィーモードアイコンをもう一度タップするとモードを終了でき、スクリーンショット機能を終了するとセルフィーモードも終了します。 ### スクリーンショット Description テキストの変更方法 ポップアップウィンドウの**Upload**ボタンから投稿をアップロードすると、スクリーンショットは基本テキストである**「#ZEPETOWorld #ZEPETO #Bildy #World」**と一緒にアップロードされます。 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/sIjDFSFTg4yk5uRre_Jib_image.png) **Edit**ボタンを押したときに出てくる**Description**ボックスにあるテキストも基本テキストである「#ZEPETOWorld #ZEPETO #Bildy #World」です。 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/sxuyTGnfV1c54e3Luy9q1_image.png) 基本Descriptionテキストを変更する方法は次のとおりです。 ::::WorkflowBlock :::WorkflowBlockItem 左側の**Hierarchy**ウィンドウで**Managers > ScreenShot**を選択します。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/3DInnxVAhJovobrAnddHH_image.png" size="56" width="775" height="834" position="center" showCaption="false"} ::: :::WorkflowBlockItem 右側の**Inspector**ウィンドウでPrefab領域の下にある**Open**ボタンを押してScreenShot Prefabを開きます。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/SbVI4skTHoh0W_DzrrVuC_image.png" size="58" width="775" height="954" position="center" showCaption="false"} ::: :::WorkflowBlockItem 左側の**Hierarchy**ウィンドウで**ScreenShot > SafeArea > ScreenShot > PreviewPanel > PreviewTextFieldPanel > PreviewInputField**を選択します。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/Ib0Eb7FFjRNuhxHU7DuBO_image.png" size="56" width="775" height="1156" position="center" showCaption="false"} ::: :::WorkflowBlockItem 右側の**Inspector**ウィンドウで、**Text**フィールドを見つけて、希望するテキストに変更します。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/rUvD-ckD5HzBU6mGixlAw_image.png" size="56" width="777" height="769" position="center" showCaption="false"} ::: :::: 以下の例のようにテキストを変更すると、Descriptionボックスのテキストが変更されたことが確認できます。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/BhuqM4jVZYsP2fWdid8vy_group-10.png" size="52" width="775" height="767" position="center" showCaption="false"} ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/8gaZrUOCSFzqwUC3rVe-H_image.png) ### スクリーンショットのアイコンが見えない時 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/JGyQL9HpFb7Ew2_X0Lu1R_image.png) 上記のように、プレイ画面の右側にスクリーンショットアイコンが見えない場合の解決方法は次のとおりです。 ::::WorkflowBlock :::WorkflowBlockItem 左側の**Hierarchy**ウィンドウで**Managers > ScreenShot**を選択します。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/zK7O2YKIa_ghgJxjkAaik_image.png" size="56" width="775" height="834" position="center" showCaption="false"} ::: :::WorkflowBlockItem 右側の**Inspector**ウィンドウで左側のチェックボックスをチェックします。 ::Image[]{src="https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/-GClHzGBnUkcFswNNSepQ_image.png" size="50" width="785" height="767" position="center" showCaption="false"} ::: ::::