'이 버튼을 가운데 정렬해 줘'와 같은 자연어 요청을 입력하여 Gemini가 레이아웃이나 스타일을 조정하도록 안내하거나, 미리보기에서 특정 UI 요소를 선택하여 컨텍스트를 개선하세요.
Compose 미리보기에 자연어 변환 적용
Gemini가 추천 코드 수정사항이 포함된 차이점을 생성합니다. 변경사항을 승인하기 전에 필요한 경우 업데이트를 검토하고 추가로 수정할 수 있습니다.
다음과 같은 프롬프트를 사용해 보세요.
'텍스트 사이에 간격을 더 추가해 줘'
'아이콘을 10% 더 크게 만들어 줘'
'배경 색상을 <색상>으로 변경해 줘'
이 페이지에 나와 있는 콘텐츠와 코드 샘플에는 콘텐츠 라이선스에서 설명하는 라이선스가 적용됩니다. 자바 및 OpenJDK는 Oracle 및 Oracle 계열사의 상표 또는 등록 상표입니다.
최종 업데이트: 2025-07-31(UTC)
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2025-07-31(UTC)"],[],[],null,["# Transform UI\n\n| **Preview:** To try transforming UI with Gemini, enable the feature through [Studio Labs](/studio/gemini/labs).\n\nYou can use Gemini to transform UI code within the Compose preview environment\nusing natural language directly in the preview.\n\nTo transform UI with Gemini, follow these steps:\n\n1. In the Compose preview panel, right-click a preview and select **Transform UI\n with Gemini**.\n\n Accessing 'Transform UI with Gemini' menu\n2. Enter your natural language request, such as \"Center align these buttons,\" to\n guide Gemini in adjusting your layout or styling, or select specific UI\n elements in the preview for better context.\n\n Applying a natural language transformation to a Compose preview\n3. Gemini produces a diff with suggested code edits. You can review and further\n refine the updates if needed before approving the changes.\n\nTry prompts like the following:\n\n- \"Add more spacing between the text\"\n- \"Make the icons 10% larger\"\n- \"Change the background color to \\\u003ccolor\\\u003e\""]]