728x90 반응형 SMALL 팝업제작2 '오토레이아웃'을 활용하여 팝업 만들어보기(2탄) 팝업을 완성해볼게요!1탄: 타이틀과 메시지 영역 추가2탄: 버튼 추가 및 팝업 완성(+컴포넌트 활용까지)오토레이아웃으로 아래 팝업을 피그마로 만들 수 있나요?추가 기능: 팝업 내 텍스트 내용이 길어지거나, 짧아지더라도 [취소], [확인] 버튼은 내용 길이에 따라 자동으로 간격 조정됨 오늘은 완성해봐요! 버튼 만들기1. 텍스트 ‘취소', ‘확인' 타이핑하여 만들기(단축키: T)2. 추가한 텍스트에 각각 오토레이아웃 추가(단축키: Shift + A)3. 오토레이아웃 각각 색상, corner radius, 크기, 테두리 설정(설정하고 싶은 색상으로 선택하세요.)4. 2개의 오토레이아웃을 모두 선택한 후 오토레이아웃 추가5. 버튼 위치를 좌, 우로 변경하기 위해, 전체 오토레이아웃 선택 후 우측패널 내 .. 2024. 11. 8. '오토레이아웃'을 활용하여 팝업 만들어보기(1탄) 팝업은 블로그 글이 너무 길어질 거 같아서 2개로 나눠서 설명드리려고 합니다! 요점 이해 부탁드려요!1탄: 타이틀과 메시지 영역 추가2탄: 버튼 추가 및 팝업 완성(+컴포넌트 활용까지)먼저, 오토레이아웃으로 아래 팝업을 피그마로 만들 수 있나요?추가 기능: 팝업 내 텍스트 내용이 길어지거나, 짧아지더라도 [취소], [확인] 버튼은 내용 길이에 따라 자동으로 간격 조정됨 피그마로 만들기 어렵다면 저와 같이 한번 만들어봐요 :) 1. 텍스트 '타이틀'과 '메시지'를 타이핑하여 만들고(단축키: T), 굵기나 크기를 설정(저는 '타이틀'에 bold 했어요) 2. 추가한 '타이틀'과 '메시지' 텍스트에 각각 오토레이아웃을 추가(단축키: Shift +A)각각 오토레이아웃을 추가하는 이유: 오토레이아웃별로 설.. 2024. 11. 5. 이전 1 다음 728x90 반응형 LIST
