จอแสดงผลขนาดใหญ่แบบกางออกและสถานะแบบพับที่ไม่ซ้ำกันช่วยให้ผู้ใช้ได้รับประสบการณ์การใช้งานแบบใหม่ในอุปกรณ์แบบพับได้ หากต้องการให้แอปรับรู้การพับ ให้ใช้ไลบรารี Jetpack WindowManager ซึ่งมีแพลตฟอร์ม API สำหรับฟีเจอร์หน้าต่างของอุปกรณ์แบบพับได้ เช่น การพับและการบานพับ เมื่อแอปรับรู้การพับ แอปจะปรับเลย์เอาต์เพื่อหลีกเลี่ยงการวางเนื้อหาที่สําคัญในพื้นที่ของรอยพับหรือรอยบานพับ และใช้รอยพับและรอยบานพับเป็นตัวคั่นตามปกติ
การทราบว่าอุปกรณ์รองรับการกำหนดค่า เช่น แบบตั้งโต๊ะหรือแบบหนังสือ ช่วยแนะนำการตัดสินใจเกี่ยวกับการรองรับเลย์เอาต์ต่างๆ หรือการให้บริการฟีเจอร์เฉพาะได้หรือไม่
ข้อมูลหน้าต่าง
อินเทอร์เฟซ WindowInfoTracker
ใน Jetpack WindowManager จะแสดงข้อมูลเลย์เอาต์หน้าต่าง เมธอด windowLayoutInfo()
ของอินเทอร์เฟซจะแสดงผลสตรีมข้อมูล WindowLayoutInfo
ที่แจ้งให้แอปทราบเกี่ยวกับสถานะการพับของอุปกรณ์แบบพับได้ เมธอด WindowInfoTracker#getOrCreate()
จะสร้างอินสแตนซ์ของ WindowInfoTracker
WindowManager รองรับการเก็บรวบรวมข้อมูล WindowLayoutInfo
โดยใช้โฟลว์ Kotlin และการเรียกกลับ Java
ความลื่นไหลของ Kotlin
หากต้องการเริ่มและหยุดการเก็บรวบรวมข้อมูล WindowLayoutInfo
คุณสามารถใช้ Coroutine ที่รับรู้วงจรการทํางานและเริ่มทํางานใหม่ได้ ซึ่งจะเรียกใช้บล็อกโค้ด repeatOnLifecycle
เมื่อวงจรการทํางานมีสถานะเป็น STARTED
เป็นอย่างน้อย และหยุดเมื่อวงจรการทํางานมีสถานะเป็น STOPPED
การดำเนินการของโค้ดบล็อกจะเริ่มต้นใหม่โดยอัตโนมัติเมื่อวงจรชีวิตคือ STARTED
อีกครั้ง ในตัวอย่างต่อไปนี้ โค้ดบล็อกจะรวบรวมและใช้ข้อมูล WindowLayoutInfo
class DisplayFeaturesActivity : AppCompatActivity() {
private lateinit var binding: ActivityDisplayFeaturesBinding
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
binding = ActivityDisplayFeaturesBinding.inflate(layoutInflater)
setContentView(binding.root)
lifecycleScope.launch(Dispatchers.Main) {
lifecycle.repeatOnLifecycle(Lifecycle.State.STARTED) {
WindowInfoTracker.getOrCreate(this@DisplayFeaturesActivity)
.windowLayoutInfo(this@DisplayFeaturesActivity)
.collect { newLayoutInfo ->
// Use newLayoutInfo to update the layout.
}
}
}
}
}
Java Callback
เลเยอร์ความเข้ากันได้ของคอลแบ็กที่รวมอยู่ในข้อกําหนดของ androidx.window:window-java
ช่วยให้คุณรวบรวมการอัปเดต WindowLayoutInfo
ได้โดยไม่ต้องใช้โฟลว์ Kotlin อาร์ติแฟกต์ประกอบด้วยคลาส WindowInfoTrackerCallbackAdapter
ซึ่งปรับWindowInfoTracker
ให้รองรับการลงทะเบียน (และการยกเลิกการลงทะเบียน) ของคอลแบ็กเพื่อรับการอัปเดต WindowLayoutInfo
ตัวอย่างเช่น
public class SplitLayoutActivity extends AppCompatActivity {
private WindowInfoTrackerCallbackAdapter windowInfoTracker;
private ActivitySplitLayoutBinding binding;
private final LayoutStateChangeCallback layoutStateChangeCallback =
new LayoutStateChangeCallback();
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivitySplitLayoutBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
windowInfoTracker =
new WindowInfoTrackerCallbackAdapter(WindowInfoTracker.getOrCreate(this));
}
@Override
protected void onStart() {
super.onStart();
windowInfoTracker.addWindowLayoutInfoListener(
this, Runnable::run, layoutStateChangeCallback);
}
@Override
protected void onStop() {
super.onStop();
windowInfoTracker
.removeWindowLayoutInfoListener(layoutStateChangeCallback);
}
class LayoutStateChangeCallback implements Consumer<WindowLayoutInfo> {
@Override
public void accept(WindowLayoutInfo newLayoutInfo) {
SplitLayoutActivity.this.runOnUiThread( () -> {
// Use newLayoutInfo to update the layout.
});
}
}
}
การรองรับ RxJava
หากใช้ RxJava
(เวอร์ชัน 2
หรือ 3
) อยู่แล้ว คุณสามารถใช้ข้อบังคับที่ช่วยให้ใช้ Observable
หรือ Flowable
เพื่อรวบรวมการอัปเดต WindowLayoutInfo
โดยไม่ต้องใช้เวิร์กโฟลว์ Kotlin
เลเยอร์ความเข้ากันได้ที่มาจาก androidx.window:window-rxjava2
และ androidx.window:window-rxjava3
นั้นประกอบด้วยเมธอด WindowInfoTracker#windowLayoutInfoFlowable()
และ WindowInfoTracker#windowLayoutInfoObservable()
ซึ่งช่วยให้แอปของคุณได้รับการอัปเดต WindowLayoutInfo
เช่น
class RxActivity: AppCompatActivity {
private lateinit var binding: ActivityRxBinding
private var disposable: Disposable? = null
private lateinit var observable: Observable<WindowLayoutInfo>
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivitySplitLayoutBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
// Create a new observable.
observable = WindowInfoTracker.getOrCreate(this@RxActivity)
.windowLayoutInfoObservable(this@RxActivity)
}
@Override
protected void onStart() {
super.onStart();
// Subscribe to receive WindowLayoutInfo updates.
disposable?.dispose()
disposable = observable
.observeOn(AndroidSchedulers.mainThread())
.subscribe { newLayoutInfo ->
// Use newLayoutInfo to update the layout.
}
}
@Override
protected void onStop() {
super.onStop();
// Dispose of the WindowLayoutInfo observable.
disposable?.dispose()
}
}
ฟีเจอร์ของจอแสดงผลแบบพับได้
คลาส WindowLayoutInfo
ของ Jetpack WindowManager ทำให้ฟีเจอร์ของหน้าต่างแสดงผลพร้อมใช้งานเป็นรายการองค์ประกอบ DisplayFeature
FoldingFeature
เป็นDisplayFeature
ประเภทหนึ่งที่ให้ข้อมูลเกี่ยวกับจอแสดงผลแบบพับได้ ซึ่งรวมถึงข้อมูลต่อไปนี้
state
: สถานะพับของอุปกรณ์FLAT
หรือHALF_OPENED
orientation
: การวางแนวของรอยพับหรือบานพับHORIZONTAL
หรือVERTICAL
occlusionType
: รอยพับหรือบานพับบดบังการแสดงผลบางส่วนหรือไม่NONE
หรือFULL
isSeparating
: ระบุว่าการพับหรือบานพับสร้างพื้นที่แสดงผลแบบตรรกะ 2 พื้นที่หรือไม่ จริงหรือเท็จ
อุปกรณ์แบบพับได้ที่มีHALF_OPENED
จะรายงานisSeparating
เป็น "จริง" เสมอเนื่องจากหน้าจอแยกออกเป็น 2 พื้นที่แสดงผล นอกจากนี้ isSeparating
จะถือเป็น "จริง" เสมอในอุปกรณ์แบบ 2 หน้าจอเมื่อแอปพลิเคชันแสดงในทั้ง 2 หน้าจอ
พร็อพเพอร์ตี้ FoldingFeature
bounds
(รับค่ามาจาก DisplayFeature
) แทนรูปสี่เหลี่ยมผืนผ้าล้อมกรอบของลักษณะการพับ เช่น การพับหรือบานพับ
คุณสามารถใช้ขอบเขตเพื่อจัดตําแหน่งองค์ประกอบบนหน้าจอโดยสัมพันธ์กับองค์ประกอบต่อไปนี้
override fun onCreate(savedInstanceState: Bundle?) {
...
lifecycleScope.launch(Dispatchers.Main) {
lifecycle.repeatOnLifecycle(Lifecycle.State.STARTED) {
// Safely collects from WindowInfoTracker when the lifecycle is
// STARTED and stops collection when the lifecycle is STOPPED.
WindowInfoTracker.getOrCreate(this@MainActivity)
.windowLayoutInfo(this@MainActivity)
.collect { layoutInfo ->
// New posture information.
val foldingFeature = layoutInfo.displayFeatures
.filterIsInstance<FoldingFeature>()
.firstOrNull()
// Use information from the foldingFeature object.
}
}
}
}
private WindowInfoTrackerCallbackAdapter windowInfoTracker;
private final LayoutStateChangeCallback layoutStateChangeCallback =
new LayoutStateChangeCallback();
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
...
windowInfoTracker =
new WindowInfoTrackerCallbackAdapter(WindowInfoTracker.getOrCreate(this));
}
@Override
protected void onStart() {
super.onStart();
windowInfoTracker.addWindowLayoutInfoListener(
this, Runnable::run, layoutStateChangeCallback);
}
@Override
protected void onStop() {
super.onStop();
windowInfoTracker.removeWindowLayoutInfoListener(layoutStateChangeCallback);
}
class LayoutStateChangeCallback implements Consumer<WindowLayoutInfo> {
@Override
public void accept(WindowLayoutInfo newLayoutInfo) {
// Use newLayoutInfo to update the Layout.
List<DisplayFeature> displayFeatures = newLayoutInfo.getDisplayFeatures();
for (DisplayFeature feature : displayFeatures) {
if (feature instanceof FoldingFeature) {
// Use information from the feature object.
}
}
}
}
ท่าทางบนโต๊ะ
เมื่อใช้ข้อมูลที่อยู่ในออบเจ็กต์ FoldingFeature
แอปจะรองรับลักษณะการวางต่างๆ เช่น วางบนโต๊ะ ซึ่งโทรศัพท์วางอยู่บนพื้นผิว บานพับอยู่ในตำแหน่งแนวนอน และหน้าจอแบบพับได้เปิดอยู่ครึ่งหนึ่ง
ท่าทางการวางบนโต๊ะช่วยให้ผู้ใช้สามารถใช้งานโทรศัพท์ได้โดยไม่ต้องถือโทรศัพท์ ท่าตั้งโต๊ะนั้นเหมาะอย่างยิ่งสำหรับการดูสื่อ ถ่ายภาพ และวิดีโอคอล

ใช้ FoldingFeature.State
และ FoldingFeature.Orientation
เพื่อระบุว่า
อุปกรณ์อยู่ในลักษณะบนโต๊ะหรือไม่ โดยทำดังนี้
fun isTableTopPosture(foldFeature : FoldingFeature?) : Boolean {
contract { returns(true) implies (foldFeature != null) }
return foldFeature?.state == FoldingFeature.State.HALF_OPENED &&
foldFeature.orientation == FoldingFeature.Orientation.HORIZONTAL
}
boolean isTableTopPosture(FoldingFeature foldFeature) {
return (foldFeature != null) &&
(foldFeature.getState() == FoldingFeature.State.HALF_OPENED) &&
(foldFeature.getOrientation() == FoldingFeature.Orientation.HORIZONTAL);
}
เมื่อทราบว่าอุปกรณ์วางอยู่บนโต๊ะแล้ว ให้อัปเดตเลย์เอาต์ของแอปตามความเหมาะสม สําหรับแอปสื่อ โดยทั่วไปแล้วหมายถึงการวางการเล่นเหนือการพับ และวางการควบคุมและเนื้อหาเสริมไว้ด้านล่างเพื่อให้รับชมหรือฟังได้โดยไม่ต้องใช้มือ
ใน Android 15 (API ระดับ 35) ขึ้นไป คุณเรียกใช้ API แบบซิงโครนัสได้เพื่อตรวจสอบว่าอุปกรณ์รองรับการใช้งานบนโต๊ะหรือไม่ ไม่ว่าสถานะปัจจุบันของอุปกรณ์จะเป็นอย่างไรก็ตาม
API จะแสดงรายการท่าทางที่อุปกรณ์รองรับ หากรายการมีท่าทางการวางอุปกรณ์บนโต๊ะ คุณสามารถแยกเลย์เอาต์แอปเพื่อรองรับท่าทางดังกล่าว และทำการทดสอบ A/B ใน UI ของแอปสำหรับเลย์เอาต์แบบตั้งโต๊ะและแบบเต็มหน้าจอ
if (WindowSdkExtensions.getInstance().extensionsVersion >= 6) {
val postures = WindowInfoTracker.getOrCreate(context).supportedPostures
if (postures.contains(TABLE_TOP)) {
// Device supports tabletop posture.
}
}
if (WindowSdkExtensions.getInstance().getExtensionVersion() >= 6) {
List<SupportedPosture> postures = WindowInfoTracker.getOrCreate(context).getSupportedPostures();
if (postures.contains(SupportedPosture.TABLETOP)) {
// Device supports tabletop posture.
}
}
ตัวอย่าง
แอป
MediaPlayerActivity
: ดูวิธีใช้ Media3 Exoplayer และ WindowManager เพื่อสร้างวิดีโอเพลเยอร์ที่รองรับการพับเพิ่มประสิทธิภาพแอปกล้องในอุปกรณ์แบบพับได้ด้วย Jetpack WindowManager โค้ดแล็บ: ดูวิธีใช้ลักษณะการวางแนวตั้งโต๊ะสำหรับแอปถ่ายภาพ แสดงช่องมองภาพที่ครึ่งบนของหน้าจอ (ครึ่งหน้าบน) และการควบคุมที่ครึ่งล่าง (ครึ่งหน้าล่าง)
ลักษณะการถือหนังสือ
ฟีเจอร์แบบพับได้ที่ไม่เหมือนใครอีกอย่างคือลักษณะการวางหนังสือ ซึ่งอุปกรณ์เปิดออกครึ่งหนึ่งและบานพับอยู่ในแนวตั้ง ท่าทางการอ่านหนังสือเหมาะสำหรับการอ่าน eBook การวางเลย์เอาต์ 2 หน้าบนหน้าจอขนาดใหญ่แบบพับได้ซึ่งเปิดอยู่เหมือนหนังสือแบบมีเล่มทำให้ท่าทางการอ่านสื่อถึงประสบการณ์การอ่านหนังสือจริง
นอกจากนี้ยังใช้ถ่ายภาพได้หากต้องการจับภาพในสัดส่วนภาพอื่นขณะถ่ายภาพแบบแฮนด์ฟรี
ใช้การจัดท่าหนังสือด้วยเทคนิคเดียวกับที่ใช้ในการจัดท่าทางบนโต๊ะ ความแตกต่างเพียงอย่างเดียวคือโค้ดควรตรวจสอบว่าการวางแนวของฟีเจอร์การพับเป็นแนวตั้งแทนแนวนอน
fun isBookPosture(foldFeature : FoldingFeature?) : Boolean {
contract { returns(true) implies (foldFeature != null) }
return foldFeature?.state == FoldingFeature.State.HALF_OPENED &&
foldFeature.orientation == FoldingFeature.Orientation.VERTICAL
}
boolean isBookPosture(FoldingFeature foldFeature) {
return (foldFeature != null) &&
(foldFeature.getState() == FoldingFeature.State.HALF_OPENED) &&
(foldFeature.getOrientation() == FoldingFeature.Orientation.VERTICAL);
}
การเปลี่ยนแปลงขนาดหน้าต่าง
พื้นที่แสดงผลของแอปอาจเปลี่ยนแปลงเนื่องจากการเปลี่ยนแปลงการกำหนดค่าอุปกรณ์ เช่น เมื่ออุปกรณ์พับหรือกางออก หมุน หรือปรับขนาดหน้าต่างในโหมดหลายหน้าต่าง
คลาส WindowManager WindowMetricsCalculator
ของ Jetpack ช่วยให้คุณดึงข้อมูลเมตริกกรอบเวลาปัจจุบันและสูงสุดได้ WindowManager
WindowMetrics
จะระบุขอบเขตของหน้าต่างเช่นเดียวกับแพลตฟอร์มWindowMetrics
ที่เปิดตัวใน API ระดับ 30 แต่ API นี้ใช้งานย้อนหลังได้จนถึง API ระดับ 14
โปรดดูใช้คลาสขนาดหน้าต่าง
แหล่งข้อมูลเพิ่มเติม
ตัวอย่าง
- Jetpack WindowManager: ตัวอย่างวิธีใช้ไลบรารี Jetpack WindowManager
- Jetcaster : การใช้ท่าทางบนโต๊ะด้วย Compose
Codelabs
- รองรับอุปกรณ์แบบพับได้และอุปกรณ์แบบ 2 หน้าจอด้วย Jetpack WindowManager
- เพิ่มประสิทธิภาพแอปกล้องในอุปกรณ์แบบพับได้ด้วย Jetpack WindowManager