안드로이드 화면 상태
- 메인스트림 크기 720px, 1080px, 1440px 등의 너비에 따라 다릅니다;
- 화면 비율에 따라 화면 비율이 2 이상인 주류 1080 * 2400, 1080 * 2340, 1080 * 2376, 1440 * 3200 화면 비율 외에도 720 * 1280, 1080 * 1920, 1080 * 2160, 1440 * 2280, 1440 * 2560, 720 * 1280, 1080 * *가 있습니다. 1920 및 기타 2 이하의 기기는 화면비는 2와 같지만 화면이 상대적으로 작기 때문에 400 * 800과 같이 두 번째로 분류할 수 있는 기기들도 있습니다;
- 대부분의 최신 휴대폰에는 화면 크기를 설정하여 화면 콘텐츠의 표시를 동적으로 변경할 수 있는 기능이 있으며, 표준 실제 비율로 표시해도 문제가 없는 콘텐츠를 조정하면 문제가 발생할 수 있습니다;
위에서 언급한 것과 같은 차이 또는 동적 조정은 Android의 화면 적응에 많은 문제를 일으킵니다.
시각적 그래픽의 원리
비주얼은 기본적으로 맵에 대한 750px * 1624px 해상도, 가로 세로 비율이 2보다 큰 iOS와 같은 레이아웃 세트에서만 기본적으로 레이아웃 세트에서 벗어날 때 비주얼 스크립트의 균일 성을 유지하기 위해 2 배 변환에 따라 너비가 375로 변환되므로 Android의 주류 모델의 폭이 px 및 dp 변환 관계를 통해 360dp로 변환되므로 폭 크기의 Android 측을 dp로 직접 사용할 수 있으므로 Android 휴대 전화에서 직접 사용할 수있는 크기입니다. 360dp이므로 라벨의 시각적 초안을 직접 사용하는 크기의 Android 측 너비가 될 수 있습니다. Google의 높이에서 슬라이딩 또는 프로그램 목록을 제공하는 것이지만 비즈니스가 페이지를 슬라이드 할 수없는 경우 수직 디스플레이의 정보 효과에 적응 문제가 발생합니다.
용어 정의
픽셀: 픽셀의 기본 단위로, 예를 들어 화면의 해상도가 1080*1920인 경우 너비 차원은 1080px, 높이 차원은 1920px입니다.
dp: 가상 픽셀 단위로, 1dp는 중간 밀도 화면에서 대략 1픽셀에 해당합니다.
SP: 확장 가능한 가상 픽셀 단위, 기본적으로 SP 단위는 DP와 동일한 크기이지만 사용자가 선호하는 텍스트 크기에 맞게 조정되어 화면의 텍스트 표시에 영향을 미치므로 일반적인 비즈니스에서는 주의해서 사용해야 합니다.
밀도: 현재 픽셀 밀도를 기준으로 dp 단위를 픽셀로 변환하는 데 사용해야 하는 배율을 지정합니다.
densityDpi: 픽셀 밀도, 인치는 화면 대각선의 길이이므로 이 값은 화면 대각선 상의 평방인치당 픽셀 수입니다.
전환 관계
160dpi 화면에서 1dp = 1px, 배율은 1입니다. 따라서 안드로이드의 dp는 렌더링하기 전에 dp를 픽셀로 변환하는 공식입니다:
1080 * 1920의 경우 화면 크기가 5이면 440이 되며, 변환 관계는 다음과 같습니다:
계산의 편의를 위해 마지막 예는 트리플 휴대폰()으로, 너비와 높이를 dp로 환산한 값은 360dp * 640dp입니다.
물리적 해상도 얻기
//화면 너비
public static int getScreenWidth(Context context) {
if (context == null) {
return -1;
}
if (screenWidth > 0) {
return screenWidth;
}
DisplayMetrics dm = context.getResources().getDisplayMetrics();
screenWidth = dm.widthPixels;
return screenWidth;
}
//화면 높이
public static int getScreenHeight(Context context) {
if (context == null) {
return -1;
}
if (screenHeight > 0) {
return screenHeight;
}
DisplayMetrics dm = context.getResources().getDisplayMetrics();
screenHeight = dm.heightPixels;
return screenHeight;
}
픽셀과 디피 상호 변환
public static float convertDpToPixel(float dp, Context context) {
Resources resources = context.getResources();
DisplayMetrics metrics = resources.getDisplayMetrics();
float px = dp * ((float)metrics.densityDpi / 160.0F);
return px;
}
public static float convertPixelsToDp(float px, Context context) {
Resources resources = context.getResources();
DisplayMetrics metrics = resources.getDisplayMetrics();
float dp = px / ((float)metrics.densityDpi / 160.0F);
return dp;
}
가상 너비 및 높이 가져오기
Display mDisplay = activity.getWindowManager().getDefaultDisplay();
float height = ExtViewUtil.convertPixelsToDp(mDisplay.getHeight(), activity);
float width = ExtViewUtil.convertPixelsToDp(mDisplay.getWidth(), activity);
화면 적응
화면마다 픽셀 밀도가 다르기 때문에 동일한 픽셀 수가 디바이스마다 다른 물리적 크기에 해당할 수 있으므로 적응 과정에서 픽셀 픽셀을 사용하여 크기를 직접 정의하지 마세요.
따라서 다양한 밀도의 화면에서 인터페이스의 가시적 크기를 유지하려면 밀도에 독립적인 픽셀을 측정 단위로 사용하여 인터페이스를 설계해야 합니다.
구성 파일 적응
리소스 적응
Google은 또한 이미지 리소스의 적응을위한 관련 밀도 한정자 폴더의 디자인이며, 크기가 다른 리소스는 위의 관계에 따라 지정된 파일 경로에 저장되어야하므로 다음 관련 DPI에서 파생 된 것입니다.
여러 개의 값 폴더를 생성하면 시스템은 한정자에 따라 해당 demens.xml 파일을 찾고 검색 원칙은 큰 것에서 작은 것으로, 예를 들어 장치의 최소 너비가 360dp 인 경우 먼저 values-sw360dp를 찾은 다음 해당 폴더가 없으면 values-sw320dp를 찾고, 해당 폴더가 없으면 기본값 아래에있는 demens.xml 파일을 찾습니다. demens.xml 파일과 일치하므로 정확히 일치하지 않더라도 잘 맞을 수 있습니다.
ScreenMatch 플러그인 링크: plugins.jetbrains.com/plugin/1005...
그러나이 적응은 철저한 방법이며, 구성 파일을 다시 실행해야하는 값의 크기가 새로 증가하고 여러 파일이 패키지 크기를 늘리는 것과 같은 유지 관리 비용이 증가하고 교차 번들 개발에 도움이되지 않으며 종속성이 필요하지 않으면 모든 UI 모듈에 적응 파일을 추가해야합니다.
밀도 변경
위의 dp와 px 변환 관계에서 px는 물리적 크기를 변경할 수 없지만 동적 설정 dp 방법을 사용하여 적응을 위해 너비 (320/360) 위에 시각적 재 작성을 고정 할 수 있습니다. 다음은 코드 실습이며 실제로 DisplayMetrics 방법을 변경하여 화면 표시 비율을 수정할 수 있지만이 방법은 전체 앱에 효과적이며 다른 페이지에 표시 문제가있을 수 있으며 사용자가 페이지 줌 크기를 수동으로 변경하는 것은 사용자 경험에 영향을 미치지 않습니다.
private static float mCurrentDensity;
private static float mCurrentScaledDensity;
public static void setCustomDensity(Activity activity, Application application) {
DisplayMetrics appDisplayMetrics = application.getResources().getDisplayMetrics();
if (0 == mCurrentDensity) {
mCurrentDensity = appDisplayMetrics.density;
mCurrentScaledDensity = appDisplayMetrics.scaledDensity;
application.registerComponentCallbacks(new ComponentCallbacks() {
@Override
public void onConfigurationChanged(@NonNull Configuration newConfig) {
if (newConfig.fontScale > 0) {
mCurrentScaledDensity = application.getResources().getDisplayMetrics().scaledDensity;
}
}
@Override
public void onLowMemory() {
}
});
}
float targetDensity = appDisplayMetrics.widthPixels / 360f;
float targetScaledDensity = targetDensity * (mCurrentScaledDensity / targetDensity);
int targetDensityDpi = (int) targetDensity * 160;
appDisplayMetrics.density = targetDensity;
appDisplayMetrics.densityDpi = targetDensityDpi;
appDisplayMetrics.scaledDensity = targetScaledDensity;
DisplayMetrics activityDisplayMetrics = activity.getResources().getDisplayMetrics();
activityDisplayMetrics.density = targetDensity;
activityDisplayMetrics.densityDpi = targetDensityDpi;
activityDisplayMetrics.scaledDensity = targetScaledDensity;
}
레이아웃 구문 적용
레이아웃이 다양한 화면 크기에 맞게 유연하게 조정되도록 하려면 하드코딩된 치수 대신 대부분의 뷰 구성 요소의 너비와 높이에 "wrap_content" 및 "match_parent"를 사용하거나 선형 레이아웃에서는 가중치 방식을, 상대 레이아웃에서는 상대 위치 RelayLayout을 사용하는 것이 바람직합니다. 을 사용하는 것이 좋습니다.
"wrap_content"는 뷰의 해당 콘텐츠에 맞는 크기로 뷰의 치수를 설정하도록 지시합니다.
"match_parent" 상위 뷰에서 뷰를 최대한 확장합니다.
제한 사항
- 어떤 적응 방법에 관계없이 구문과 결합하는 것은 필수이지만 일부 패드 모델의 경우 컨트롤 문제의 수직 스트레칭으로 이어질 수 있으므로 일반적으로 최대 레이아웃 크기를 제한해야하며 일반적으로 360dp / 320dp로 제한 될 수 있습니다;
- 사용 구성 파일은 완전히 적응 된보기의 너비에있을 수 있습니다, 철저한 dp를 픽셀 값으로 변환하기 위해 어댑터 파일의 존재는 또한 패키지 크기를 증가시키고, 교차 번들 개발에 도움이되지 않습니다, 의존성이 필요하거나 그렇지 않으면 모든 UI 모듈에 어댑터 파일을 추가해야하므로 패킷 크기를위한 단일 애플리케이션에 적응하는 방법은 비즈니스의 개발에 민감하지 않습니다, 프로그램은 이러한 각 경우에 알리 페이의 비즈니스 사용 조건을 충족하지 못합니다. 프로그램이 알리페이의 비즈니스 사용 조건을 충족하지 않습니다;
- 변경 밀도를 사용하면 변경 로직이 전역적으로 적용되어 다른 페이지의 표시 효과에 영향을 미치고 사용자가 화면 크기를 수정하면 원하는 확대/축소 표시 효과와 일치하지 않아 사용자의 사용에 영향을 미칩니다;
- 모두 높이를 조정할 수 없으므로 목록이나 슬라이드에 의존하여 조정해야하며 슬라이드가 아닌 경우 화면 동적 판단을 조정해야합니다.
최종 연습
화면 조정의 경우 위와 같이 Google은 실제로 많은 공식적인 작업을 수행했으며 가상 픽셀 및 레이아웃 구문 방식을 사용하여 실제로 대부분의 문제를 해결했으며 일부 특수 모델에서는 미세 조정이 가능합니다.
너비 치수는 일반적으로 컨트롤 타일링 + 여백을 사용하여 공백을 남겨두고 콘텐츠가 가로로 중앙에 오도록 설정합니다.
- 작은 화면 휴대 전화 : 컨트롤 타일 + 여백 방법을 일반적으로 사용하여 적응을 위해 흰색을 남겨두고 텍스트 또는 컨트롤이 너무 많은 정보를 표시하는 경우 텍스트가 접는 선 또는 타원을 사용하는 경우 이러한 종류의 문제를 해결하기 위해 가장 작은 모델에 따라 컨트롤이 디버깅에 적응할 수있는 가장 작은 모델에 따라 360dp보다 낮은 일부 휴대 전화가 여전히 표시됩니다!
- 와이드스크린 휴대폰: 화면 비율 디스플레이에 주의해야 하는 컨트롤의 경우 컨트롤의 최대 너비를 설정하여 컨트롤이 과도하게 늘어나는 것을 방지할 수 있습니다.
2 개 모델보다 큰 종횡비의 높이 치수는 하향식 배열을 위해 레이블 위의 시각적 스크립트를 직접 사용할 수 있으며, 작은 화면 휴대 전화의 경우 720 * 1280 또는 1080 * 1920 시각적 스크립트에서 화면 해상도를 결정하고 컨트롤 높이의 높이를 표시하는 코드에서 적응을 위해 시각적 스크립트를 사용할 수 있으며 여백 디버깅. 물론 페이지에서 목록이나 슬라이딩 가능한 특성을 사용할 수 있는 경우 적응 문제의 높이가 없습니다!
그러나 일부 모델에서는 화면 확대/축소 크기를 변경할 수 있으며, 해상도가 1080px * 2312px인 휴대폰을 예로 들면 밀도가 클수록 보기가 더 크게 표시되며 통계는 다음과 같습니다:
- 하단 가상 버튼을 켭니다:
| 너비 | 높이 | 밀도 | 밀도Dpi |
|---|---|---|---|
| 360.0 | 722.6667 | 3.0 | 084 |
| 338.32852 | 677.3333 | 3.7815 | 015 |
| 320.0 | 637.73005 | 3.573 | 045 |
- 하단 가상 버튼을 숨깁니다:
| 너비 | 높이 | 밀도 | 밀도Dpi |
|---|---|---|---|
| 360.0 | 770.6667 | 3.0 | 084 |
| 338.32852 | 725.3333 | 3.7815 | 015 |
| 320.0 | 685.73005 | 3.573 | 045 |
1080 * 1920 휴대 전화 배율을 사용하면 높이가 더 작아집니다. 따라서 모델 적응을 위해 화면 적응을 결정하기 위해 물리적 해상도를 단순히 사용하는 것은 분명히 적응의 요구, 동적 적응 판단을 위해 가상 dp 크기의 너비와 높이를 변환해야하는 필요성을 충족 할 수 없습니다. 작은 화면 휴대 전화 적응 임계 값을 찾기 위해 여러 모델에서 다음 비교 테스트를 수행하면 특정 비즈니스를 동적으로 조정할 수 있습니다.
public static boolean isLowDeviceScreen(Activity activity) {
try {
Display mDisplay = activity.getWindowManager().getDefaultDisplay();
float height = ExtViewUtil.convertPixelsToDp(mDisplay.getHeight(), activity);
float density = activity.getResources().getDisplayMetrics().density;
AliUserLog.i(TAG, "isLowDeviceScreen - height = " + height + " density = " + density);
return height <= 685f;
} catch (Exception e) {
AliUserLog.e("isLowDeviceScreen -Exception ", e);
}
return false;
}
적응 문제는 실제로 가장 중요한 것은 시각적으로 자주 소통하는 것이며, 제한된 화면에서 전송해야하는 정보의 양이 제한되어 있으며, 너무 많은 정보는 화면 제어 디스플레이가 상대적으로 꽉 차게되지만 사용자 경험에 영향을 미칩니다.
향후:
향후에는 RN+Flutter+H5+클라우드 렌더링과 같은 크로스 플랫폼 또는 동적 솔루션이 네이티브 페이지의 일부를 대체할 것이지만, 다른 기술 스택 적응 문제가 발생하여 개발자가 적응 체계를 지속적으로 고민하고 조정해야 합니다.
