--- title: ScreenShot slug: world-sdk-guide-kr/screenshot 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) | 이미지를 피드에 업로드합니다. 게시물의 내용은 두 번째 인수인 contents를 통해 지정할 수 있습니다. 월드 태그는 자동으로 적용되어 피드에 게시됩니다. | | ZepetoWorldContent.CreateFeed(texture: UnityEngine.Texture2D, contents: string, $result: System.Action$1) | 이미지를 피드에 업로드합니다. 게시물의 내용은 두 번째 인수인 contents를 통해 지정할 수 있습니다. 월드 태그는 자동으로 적용되어 피드에 게시됩니다. | 다음은 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, "[content]", (result: boolean) => {console.log(`피드 생성 결과 : ${result}`)}); ZepetoWorldContent.CreateFeed(this.texture2D, "[content]", (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, "[CONTENT]", (result: boolean) => { this.logText.text = `피드 생성 결과 : ${result}`; }); }); } } ``` :::hint{type="danger"} - 유니티 에디터 모드에서는 확인할 수 없지만, 앱에서 플레이할 때 확인할 수 있습니다. ::: ## 스크린샷 스크린샷 모듈은 빌드잇 유니티 플러그인에 포함되어 있으며, 아래 GitHub에서 모듈 스크립트를 확인할 수 있습니다.  :::hint{type="info"} 📘 **빌드잇 유니티 플러그인 스크린샷 모듈** - [GitHub 링크](https://github.com/Zepeto-TechEvangelist/zepeto_buildit_template/tree/main/Assets/BuilditTemplate/Modules/Screenshot) ::: ### 스크린샷 기능 사용 방법 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/jT8RlnrfDfZKUG57AzbQE_image.png) 스크린샷 기능은 빌드잇 유니티 플러그인 월드 플레이 화면의 우측에 위치한 카메라 아이콘을 눌러 사용할 수 있습니다. ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/_P-YjWdx527Rn8LhoRXET_image.png) - **1: 셀카 모드 버튼** - 카메라를 셀카 모드로 전환할 수 있습니다. - **2: 사진 촬영 버튼** - 플레이 화면을 촬영할 수 있습니다. - **3: 동영상 녹화 버튼 ** - 플레이 화면을 녹화할 수 있습니다. - **4: 나가기 버튼** - 스크린샷 모드를 나갈 수 있습니다. :::hint{type="info"} ✏️ **노트** - 채팅 말풍선은 촬영되지 않으니 참고하여 주세요. ::: ### 사진 촬영 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/dwtOhNPliRcEJb0Ou-Hj8_image.png) 사진 촬영 버튼을 누르면 위와 같은 팝업 창이 나타납니다. **Upload** 버튼을 누르면 촬영된 사진이 내 제페토 피드에 바로 업로드 됩니다. - 사진은 스크린샷 Prefab에 설정된 기본 Description 텍스트와 함께 피드에 업로드 됩니다. 기본 텍스트를 변경하는 방법은 [스크린샷 Description 텍스트 변경 방법](docId:5kJBaXCklgmX4CrJAI6EA)을 참고해주세요. **Edit** 버튼을 누르면 스크린샷을 피드에 업로드하기 전에 게시물 텍스트를 수정할 수 있습니다. ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/xMYxV3oyzx9EOXVhFASy5_image.png) - **1: 공유 버튼** - 스크린샷을 공유할 수 있습니다. - **2: 다운로드 버튼** - 스크린샷을 내 기기에 저장할 수 있습니다. - **3: 나가기 버튼** - Edit 모드를 나갈 수 있습니다. - **4: 사진 미리보기 창** - 촬영된 스크린샷을 미리 볼 수 있습니다. - **5: 포스트 텍스트 수정** - 스크린샷과 함께 제페토 피드에 업로드 될 텍스트를 수정할 수 있습니다. - **6: 업로드 버튼** - 스크린샷과 텍스트를 제페토 피드에 업로드 할 수 있습니다. ### 동영상 녹화 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/VYv4-316Iui5uCYuLf6OX_videorecording.gif) 동영상 녹화 버튼을 누르면 녹화가 시작되며, 녹화 시간이 디스플레이 됩니다. ### 셀카 모드 ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/oNkb24lRswQuh3syXeJbX_image.png) 스크린샷 아이콘을 누르면 셀카 모드 아이콘이 나타납니다. ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/DK1ayOa9c0YMCf9XvqV8Y_image.png) 아이콘을 누르면 셀카 모드를 사용할 수 있습니다. ![](https://api.archbee.com/api/optimize/xv-TGeWVTX2GDZMFGOf1Y/UF_3BUBY0CUVjYaXXeale_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"} ::: ::::