오마이앱 가이드
  • 가이드
    • 오마이앱 시작하기
    • 가이드 사용법
    • 앱 만들기
      • 1. 웹 메뉴 만들기
      • 2. 데이터 항목 만들기
      • 3. 앱 메뉴 만들기
      • 4. 앱 화면 만들기
        • 패키지
          • [기본형] 쇼핑몰
          • 게시판형 커뮤니티
          • 거래 플랫폼
          • 가이드 with 유튜브
          • 그룹별 커뮤니티
          • 예약 시스템
          • 이미지형 이벤트 목록
          • 지역별 필터 및 검색 헤더
          • 키워드 선택 리뷰
          • 리워드 적립
          • 모임
          • 클래스 신청
          • 일정 관리
        • UI 패키지
          • 다른 유저 프로필 화면
        • 화면 구성
          • 헤더
          • 커스텀 헤더
          • 화면 구성 항목
          • 플로팅 아이템
          • 검색 구성 항목
          • 카드 스타일
          • 카드 플로팅
          • 댓글 설정
          • 답글 설정
          • 빈 화면
          • 커스텀 빈 화면
        • 블록
          • 레이아웃
            • 그리드
            • 플렉스
            • 리스트
            • 스와이프
          • 스위치
            • 스위치(조건)
            • 스위치(참/거짓)
          • 데이터 참조
            • 단건 관계
            • 다건 관계
            • listByMeta
            • dataByMeta
          • 텍스트
            • 텍스트
            • 멀티 라인 텍스트
            • 변수 텍스트
            • 마크다운
            • HTML 편집기
            • 전화번호
          • 숫자/날짜
            • 숫자
            • 금액
            • 숫자 편집기
            • 별점 평가
            • 범위 슬라이더
            • 날짜/시간
            • 날짜
            • 시간
          • 선택
            • 드롭다운 선택
            • 체크박스
            • 단일 항목 선택
            • 다중 항목 선택
          • 사진/동영상
            • 이미지
            • 단일 이미지
            • URL이미지
            • 비디오
            • 아이콘
            • 유튜브
          • 주소/지도/위치
            • 주소
            • 네이버 맵
            • 거리
          • 계산
            • countByMeta
            • 자바스크립트 기반 계산
          • 기타
            • 버튼
            • 구분선
            • 링크
            • SNS
            • reservation
            • 구글 광고
            • 프로그레스 바
            • 웹 뷰
          • 검색창
            • 텍스트 검색창
            • 단일 카테고리 검색창
            • 다중 카테고리 검색창
        • 옵션
        • 스타일
          • 글자
          • 여백
          • 테두리
          • 배경 색상
          • 배경 모서리 곡률
          • 정렬
          • 넓이
          • 높이
          • 비율
          • 라인 개수
          • 힌트
          • 그리드 컬럼 비율
          • 색상
      • 5. 명령/실행 기능 구현하기
        • 액션 타입
          • 데이터 등록/수정(upsert)
          • 데이터 수정(update)
          • 데이터 삭제(delete)
          • 목록 화면으로 이동(list)
          • 상세 화면으로 이동(read)
          • 데이터 등록 화면으로 이동(create)
          • 데이터 수정 화면으로 이동(edit)
          • 커스텀 화면으로 이동(multiList)
          • 해당 링크로 이동(link)
          • 1:1 채팅방으로 이동(makeDirectChatRoom)
          • 채팅 메뉴로 이동(chatList)
          • 현재 화면 닫기(뒤로가기)(dismiss)
          • 모든 화면 닫기(allDismiss)
          • 신고(report)
          • 연락처 가져오기(phoneBook)
          • 단일 연락처 가져오기(phoneBookSingle)
          • 바텀시트(bottomSheet)
          • 다이얼로그 팝업창(dialog)
          • 포트원 결제(iamportPayment)
          • 나이스 페이 결제(nicePayment)
          • 공유하기(share)
          • 파일 업로드(fileUpload)
          • 사운드(sound)
          • 클립보드에 복사(clipboard)
        • 체인
          • 변경(change)
          • 필터 조건(filter)
          • 정렬 항목(order)
          • 그룹 정렬(groupSort)
        • 로직 만들기
          • If When
            • Every set time
          • Condition
            • New data query
              • @setValue
              • @query
              • @if
              • @returnException
              • @for
              • @api
              • @operation
              • @afterAction
          • Then
            • Create Data
            • Updated Data
            • Delete Data
            • Send Push Notifications
            • Call the API
            • Modify Multiple Data Entries
            • Delete Multiple Data Entries
            • Send Email
            • Send a Text Message
            • If Data Exists, Modify / If Not, Create
            • API to DB
            • Custom Return Output
            • Message Return Output
            • Google Payment
            • Apple Payment
            • No Action
          • Util
            • 데이터 형 변환
      • 6. 변경 전 내용으로 되돌리기
        • 6-1. 서비스 초기화 방법
      • 7. 외부 기능 가져오기
      • 8. 환경 설정하기
      • 유의사항
      • 내가 만든 앱 공개하기
    • 앱 출시하기
      • Google Play에 앱 출시하기
        • 1. 구글 개발자 계정 등록
        • 2. 관리자 웹 Android 설정
        • 3. Firebase 프로젝트 생성
        • 4. Android 앱 등록
        • 5. 관리자 웹 Android 앱 빌드
        • 6. 플레이 콘솔 앱 생성
        • 7. 플레이 콘솔 앱 설정
        • 8. 앱 테스트
        • 9. 앱 게시하기
        • 선택사항
          • 애플 로그인 연동 (선택)
          • 카카오 로그인, api 연동 (선택)
          • 네이버 지도 연동 (선택)
      • App Store에 앱 출시하기
        • 1. 애플 개발자 계정 등록
        • 2. 번들 ID 생성
        • 3. Firebase iOS 앱 등록
        • 4. Firebase 푸시 알림
        • 5. 관리자 웹 iOS 설정
        • 6. 애플 로그인 설정
        • 7. iOS 앱 빌드
        • 8. iOS 앱 제출 준비
        • 9. 앱 정보 입력
          • 9-1. 일반 정보 - 앱 정보
          • 9-2. 일반 정보 - 가격 및 사용 가능 여부
          • 9-3 일반 정보 - 앱이 수집하는 개인정보
        • 10. 테스트플라이트로 앱 검토
        • 선택사항
          • 카카오 로그인, api 연동 (선택)
          • 네이버 지도 연동(선택)
          • 앱 심사 관리 (선택)
        • 11. 심사 제출
      • 참고 자료
        • 앱 아이콘/스크린샷
        • 약관 관리
      • 앱 업데이트
        • 강제 업데이트 방법
        • 최신 버전으로 앱 업데이트
    • 앱 운영하기
      • 사업자등록 신청
      • 상표권 등록
      • 결제 관리
      • 앱 업데이트하기
      • 대시보드 만들기
    • 자주 하는 질문
      • 앱 설정
        • 1. 내가 작성한 글만 모아보고 싶어요.
        • 2. '좋아요' 한 목록만 모아보고 싶어요.
        • 3. 좋아요/댓글 많은 순서로 정렬하고 싶어요.
        • 4. 최신순, 오래된 순 정렬은 어떻게 하나요?
        • 5. 관리자 웹과 앱의 댓글/답글 정렬 순을 통일하고 싶어요.
        • 6. 블록을 가로로 배치하고 싶어요.
        • 7. 단일 메타를 복합 메타로 변경하고 싶어요.
        • 8. 텍스트가 길 경우, •••으로 처리하고 싶어요.
        • 9. 데이터가 없을 때 나오는 문구를 수정하고 싶어요.(ex. 새로운 글이 없습니다.)
        • 10. 상단바에 알림 아이콘을 추가하고 싶어요.
        • 11. 게시글의 좋아요, 댓글 수를 표시하고 싶어요.
        • 12. 게시글 조회수를 표시하고 싶어요.
        • 13. 대표 썸네일 한장만 보이고 싶어요.
        • 14. 검색 블록을 사용하고 싶어요.
        • 15. 제목, 내용 이외에 닉네임으로도 검색하고 싶어요.
        • 16. 카테고리에 '전체'를 추가하고 싶어요.
        • 17. 데이터 총 개수를 표시하고 싶어요.
        • 18. 작성한 글을 작성자와 관리자 웹에서만 볼 수 있게 하고싶어요.
        • 19. 합계를 표현하고 싶어요.
        • 20. 날짜/시간 표현 방식을 바꾸고 싶어요.
        • 21. 버튼을 누르면 화면이 바뀌게 하고 싶어요.
        • 22. 사진이 화면에 안 나와요.
        • 23. 리뷰 평점을 계산하고 싶어요.
      • 액션
        • 1. 글 작성 버튼을 만들고 싶어요.
        • 2. 이미지 클릭 시 원하는 카테고리 목록을 보여주고 싶어요.
        • 3. 채팅하기 버튼을 만들고 싶어요.
        • 4. 인스타그램 링크를 연결하고 싶어요.
        • 5. 공유하기 기능을 사용하고 싶어요.
        • 6. 복합 메타에서 좋아요 기능을 사용하고 싶어요.
        • 7. 카카오 네비로 연결하고 싶어요.
      • 옵션
        • 1. 등록/수정 화면에 적용한 드롭다운 선택 옵션을 목록 화면에서도 보이게 하고 싶어요.
      • 로직
        • 1. 내 정보에서 수정한 데이터를 게시물에도 반영되게 하고 싶어요.
        • 2. 회원가입 즉시, 유저에게 등급을 주고 싶어요.
        • 3. 작성 글에 댓글이 달리면 푸시 알림을 발송하고 싶어요.
        • 4. 상점 리뷰 등록 시 기존 상점 리뷰의 총점을 수정하고 싶어요.
        • 5. 오픈 API를 연계하고 싶어요.
        • 6. 푸시 알람을 누르면 상세 화면으로 이동하게 하고 싶어요.
        • 7. 댓글 푸시를 만들고 싶어요.
        • 8. 입력된 데이터를 숫자(int) 형태로 변환하고 싶어요
        • 9. 순서대로 번호를 부여하고 싶어요.
      • 관리자 웹
        • 1. 데이터를 엑셀 파일로 다운로드 받고 싶어요.
        • 2. 샘플 계정, 임의의 계정을 만들고 싶어요.
      • 패키지
        • 2. [완성형 쇼핑몰 패키지 전용] 하나의 상품에 두가지 옵션을 만들고 싶어요.
      • 앱 출시
        • 1. 앱 빌드가 계속 진행중으로 나와요.
        • 2. 출시 후 SNS 로그인이 안돼요.
        • 3. 테스트 플라이트에서 앱이 바로 꺼져요.
        • 4. 앱 빌드가 실패했다고 나와요.
        • 5. iOS 앱 빌드 시 인증서 초과라는 알람이 옵니다.
      • 결제 연동
        • 1. 포트원 결제 연동은 어떻게 하나요?
        • 2. 나이스 페이먼츠 결제 연동은 어떻게 하나요?
        • 3. 페이팔 결제 연동은 어떻게 하나요?
        • 4. 다날 심사 받았는데 계속 테스트 결제만 돼요.
      • 기타
        • 1. 변경 사항 저장 후 확인해도 변경되지 않았어요.
        • 2. 메타 삭제를 어디에서 할 수 있나요?
        • 3. UI 패키지를 사용하고 싶어요.
        • 4. 앱 실행 시, 비회원도 앱을 이용할 수 있도록 로그인 화면을 없애고 싶어요.
        • 5. 트위터로 로그인하고 싶어요.
        • 6. 앱 사용 시, 차단 유저 관리는 어디서 할 수 있나요?
        • 7. 쿠폰은 어떻게 적용할 수 있나요?
        • 8. 권장 이미지 사이즈가 있나요?
        • 9. chatGPT API 크래딧 등록
        • 10. Android와 iOS 화면이 다르게 나와요.
    • 단어집
      • 데이터
      • 데이터베이스
      • 메타
      • 모드
      • 목록 화면
      • 등록/수정 화면
      • 상세 화면
      • 로직
      • 옵션
      • 옵션 명
      • 옵션 코드
      • 옵션 ID
      • 조건
      • 컬렉션 명
      • 항목
      • 항목 명
      • 항목 ID
      • 화면 구성 항목
  • 오마이앱 클래스
    • 👥크루 앱 만들기 프로젝트
    • 💡오마이앱 사용법 기초
    • 🥕당근마켓 앱 따라 만들기
      • 1. 데이터 항목 만들기
      • 2. 메뉴 탭 따라 만들기
      • 3. 목록 화면 따라 만들기
      • 4. 상세 화면 따라 만들기
      • 5. 등록/수정 화면 따라 만들기
      • 6. 채팅 탭 따라 만들기
      • 7. 내 정보 탭 따라 만들기
      • 8. 푸시 알림 따라 만들기
    • 🐶강아지 앱 따라 만들기
      • 1. 웹 메뉴 추가하기
      • 2. 데이터 항목 설정하기
      • 3. 옵션 설정하기
      • 4. 데이터 등록하기
      • 5. 앱 메뉴 추가하기
      • 6. 앱 화면 설정하기
        • 6-1 목록 화면 만들기
        • 6-2 상세 화면 만들기
        • 6-3 등록/수정 화면 만들기
        • 6-4 스타일 적용하기
        • 6-5 패키지 적용하기
        • 6-6 액션 설정하기
      • 7. 로직 설정하기
      • 8. 메타 되돌리기
      • 9. 환경 설정하기
    • 〽️로직 알아보기
      • 1. 로직 입문하기
      • 2. 푸시 알람 보내기
      • 3. 연결된 데이터 동기화하기
  • 실습 샘플 이미지
    • 동물병원
    • 반려동물
    • 배너
    • 상세 페이지
Powered by GitBook
On this page
  1. 가이드
  2. 앱 만들기
  3. 4. 앱 화면 만들기

스타일

Previous옵션Next글자

Last updated 1 year ago

블록의 스타일 설정을 통해 앱 화면에서의 글자 및 이미지 크기, 여백, 위치 등을 정해줄 수 있어요.

앱 설정 ➡︎ 해당 블록 선택 ➡︎ 우측 사이드 바 스타일

처음부터 스타일 설정에 너무 많은 시간을 쓰는 것은 추천하지 않아요. 기능을 추가하다 보면 스타일을 다시 수정해야 하는 경우가 많아요.

2023.10.04 Jinny

Style

You can customize the font size, spacing, and placement of building blocks on the app page using building blocks' style settings.

2023.07.28 Song