Share via


Surface Duo용 Flutter MediaQuery

응용 프로그램이 Surface Duo의 두 화면에 걸쳐 있는 경우 캔버스에는 화면과 화면 사이의 힌지 영역이 모두 포함됩니다. 힌지는 디스플레이 오우처 이며 MediaQuery를 사용하여 화면에 있는 위치를 알 수 있습니다. MediaQuery에는 하드웨어 기능에 의해 방해되는 디스플레이의 모든 영역을 나열하는 라는 displayFeatures 속성이 있습니다.

int featuresCount = MediaQuery.of(context).displayFeatures.length;

힌지 확장 메서드

Surface Duo의 힌지 작업을 더 쉽게 수행하려면 확장 메서드 MediaQueryData를 에 추가하는 것이 좋습니다. 이렇게 하면 를 사용하여 직접 작업할 수 있습니다 MediaQuery.of(context).hinge. 디바이스에 힌지 가 없으면 값이 null이 됩니다.

/// Extension method that helps with working with the hinge directly. 
extension MediaQueryHinge on MediaQueryData { 
  DisplayFeature? get hinge { 
    for (final DisplayFeature e in displayFeatures) { 
      if (e.type == DisplayFeatureType.hinge) 
        return e; 
    } 
    return null; 
  } 
}

힌지의 존재 여부를 확인하는 것은 다음과 같습니다.

bool hasHinge = MediaQuery.of(context).hinge != null;

기능 표시

디스플레이 기능은 비기능적이거나 방해가 될 수 있는 디스플레이 영역입니다. 클래스 구조는 다음과 같습니다.

class DisplayFeature {
    final Rect bounds;
    final DisplayFeatureType type;
    final DisplayFeatureState state;
}

DisplayFeature의 속성:

  • bounds - Rect 이 디스플레이 기능이 차지하는 보기 영역
  • type - 표시 기능 유형에 대한 열거형:
    • hinge - 디바이스의 두 디스플레이 사이의 물리적 구분 기호입니다. Surface Duo에는 hinge 디스플레이 기능이 있습니다. 표시 기능 유형: 힌지
    • fold - 너비가 0인 hinge 으로 봅니다. 유연한 디스플레이에 주름이 있는 위치를 식별합니다. 표시 기능 유형: 접기
    • cutout - 디스플레이의 가장자리에 앉아 일반적으로 카메라 시스템을 수용. 표시 기능 유형: 컷아웃
  • state - 접기 및 힌지에 대해서만 채워지는 디스플레이 기능의 자세에 대한 열거형입니다. 컷아웃의 경우 입니다 unknown. 이는 Android의 자세 정의를 밀접하게 따릅니다.
    • halfOpened - 접을 수 있는 디바이스의 힌지는 열린 상태와 닫힌 상태 사이의 중간 위치에 있으며, 유연한 화면의 일부 또는 실제 화면 패널 사이에 평면이 아닌 각도가 있습니다.
    • flat - 폴더블 디바이스가 완전히 열려 있으며 사용자에게 표시되는 화면 공간이 평평합니다.
    • unknown - 새로운 상태이거나 지원되지 않거나 기능의 cutout 경우 채워지지 않으므로 자세를 알 수 없습니다.

상위 수준 구성 요소

프로젝트가 적합한 경우 더 높은 수준의 구성 요소를 사용하는 것이 좋습니다. TwoPane은 애플리케이션이 확장될 때 각 화면을 쉽게 채울 수 있는 위젯입니다. 결과적으로 태블릿, 데스크톱 및 대형 화면 레이아웃도 지원합니다.

대화 상자와 팝업 메뉴는 디스플레이 기능을 고려하며 서로 겹치지 않도록 합니다. 대화 배치 및 팝업 동작을 더 잘 제어하려면 힌지 인식 팝업 경로 문서를 참조 하세요.