[안드로이드]마크업/마크다운/ HTML/ XML/픽셀/dpi,dp단위

dada·2021년 8월 28일
0

Android

목록 보기
4/16
post-thumbnail

📝마크업 언어

  • "마크(Mark)","태크(Tag)"로 둘러싸인 언어
  • 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지
  • 문서의 골격에 해당하는 부분을 작성
  • 일반적으로는 데이터를 기술하는 정도로만 사용되기 때문에 프로그래밍 언어와는 구분됨
  • 종류
    HTML : Hyper Text MarkUp Language
    XML: eXtensible Markup Language
  • HTML, XML차이
    • HTML이 데이터의 표현에 그 목적을 두고 있다면 XML은 데이터 교환을 위한 구조정의에 그 목적을 두고 있음 즉, 언어로부터 독립적으로 여러 에플리케이션에서 사용할 수 있도록 데이터를 저장해주고 전달해주는 매개체가 되는 존재
    • Html과 다르게  XML은 사전 정의 태그가 존재하지 않음
    • HTML이 인터넷 웹 환경에서 작동되는 언어라고 본다면 XML은 어느 특정 환경에 구애를 받지 않음

📝마크다운 언어

  • 마크업 언어의 일종
  • 마크다운 언어로 만든 파일=.md 확장자의 파일 (Readme.md 라던지...)

📱픽셀(화소)

  • 디지털 화상을 구성하는 최소 단위
  • PX 단위는 화면의 전체 화면 크기와 상관없이 지정한 수치만큼 표시되는 절대적 표시 단위이므로 안드로이드에서는 PX보다는 DP 단위를 사용

📱dp(Density Independent Pixcel)

  • DP는 픽셀 독립 단위
  • 화면의 크기가 달라도 동일한 비율로 보여주기 위해 안드로이드에서 정의한 단위이며 dp단위를 사용하면 기기마다의 차이를 고민하지 않고도 인터페이스를 디자인할 수 있어서 안드로이드에서 주로 사용되는 단위

예시) 같은 사이즈의 애플리케이션에 Low, Medium, High-density 화면에 PX 단위로 크기를 지정했을 때

예시) 같은 사이즈의 애플리케이션에 Low, Medium, High-density 화면에 DP 단위를 지원했을 때

📱dpi(Dot Per Inch)

  • 1cm화면에 픽셀 갯수 몇개?를 나타내는 단위 ex)100dpi는 1인치에 픽셀 100개
  • 안드로이드의 기준 DPI는 160 DPI이다. 160 DPI인 경우 밀도 독립단위 DP와 PX이 같은 크기를 갖음 즉, 16DPI에서는 1dp는 1px이 됨
    • ldpi : 120dpi(1인치에 120픽셀, 가장 작은단위)
      mdpi : 160dpi (안드로이드 기준)- 갤럭시 에이스, 옵티머스 원
      hdpi : 240dpi-갤럭시 s2,옵티머스 2x,넥서스 원
      xhdpi : 320dpi- 갤럭시 s3, 옵티머스 g, 베가레이서 2
      xxhdpi : 480dpi-갤럭시 s5 LG G3 넥서스 5x
      xxxhdpi : 640dpi-갤럭시 s9 LG G6 넥서스 6

내가 48dp짜리 버튼을 넣고 싶다
실제로는 코드 작성할때 px기준으로 작성해야 한다
핸드폰 기종마다 dp가 px될때 곱해지는 해상도(dpi)가 다르다
만약 xxxhdpi 기기인 갤럭시 s7을 기준으로만 한다면
? px = 48* (640/160) 가로 세로가 192px인 아이콘을 그리면 됨

💻DP<->PX

  • 개발을 하다보면 DP를 PX로 바꿔줘야할 경우가 있음
    안드로이드 레이아웃을 코드 작성 할때 는 DP를 사용할 수가 없기 때문
  • 공식
    px = dp 단말 DPI/기본 160
    dp = px
    기본 160/단말 DPI
    단위변환 계산 링크

💻48dp리듬

  • 안드로이드 가이드라인에는 48dp(7~10mm)리듬을 가지고 디자인하라는 조언
    손끝으로 터치스크린을 건드렸을 때 접촉하는 평균적인 크기이기 때문.
  • 48dp라는 크기를 외워서 사용하면 좋은 ui는 아이콘부터 버튼, 리스트에서 시작할 수 있음
  • 해상도별 48dp의 픽셀 값
    • mdpi 48px
      hdpi
      72px
      xhdpi 96px
      xxhdpi
      144px
      xxxhdpi _ 1920px
profile
'왜?'라는 물음을 해결하며 마지막 개념까지 공부합니다✍

0개의 댓글