ภาพรวมของแท็บที่กำหนดเองใน Android
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
Custom Tab เป็นฟีเจอร์ในเบราว์เซอร์ Android ที่ช่วยนักพัฒนาแอปในการเพิ่มประสบการณ์การใช้งานเบราว์เซอร์ที่ปรับแต่งเองภายในแอปได้โดยตรง
การโหลดเนื้อหาเว็บเป็นส่วนหนึ่งของแอปบนอุปกรณ์เคลื่อนที่มาตั้งแต่ยุคแรกๆ ของสมาร์ทโฟน แต่ตัวเลือกเก่าๆ อาจทำให้เกิดปัญหาสําหรับนักพัฒนาแอป การเปิดตัวเบราว์เซอร์จริงเป็นการเปลี่ยนบริบทที่หนักหน่วงสำหรับผู้ใช้ที่ปรับแต่งไม่ได้ ขณะที่ WebView ไม่รองรับฟีเจอร์ทั้งหมดของแพลตฟอร์มเว็บ ไม่ได้แชร์สถานะกับเบราว์เซอร์ และเพิ่มค่าใช้จ่ายในการบำรุงรักษา
แท็บที่กำหนดเองช่วยให้ผู้ใช้อยู่ในแอปขณะท่องเว็บได้ ซึ่งจะเพิ่มการมีส่วนร่วมและลดความเสี่ยงที่ผู้ใช้จะเลิกใช้งานแอป แท็บที่กำหนดเองจะทำงานโดยเบราว์เซอร์ที่ผู้ใช้ต้องการโดยตรง และจะแชร์สถานะและฟีเจอร์ที่เบราว์เซอร์นำเสนอโดยอัตโนมัติ คุณไม่จําเป็นต้องเขียนโค้ดที่กําหนดเองเพื่อจัดการคําขอ การมอบสิทธิ์ หรือที่เก็บคุกกี้
แท็บที่กำหนดเองทําอะไรได้บ้าง
เมื่อใช้แท็บที่กำหนดเอง เนื้อหาเว็บจะโหลดในเครื่องมือแสดงผลที่ขับเคลื่อนเบราว์เซอร์ที่ผู้ใช้ต้องการ ฟีเจอร์ API หรือแพลตฟอร์มเว็บใดๆ ก็ตามจะพร้อมใช้งานในแท็บดังกล่าวและในแท็บที่กำหนดเอง เซสชันการท่องเว็บ รหัสผ่านที่บันทึกไว้ วิธีการชำระเงิน และที่อยู่ทั้งหมดจะปรากฏขึ้นเหมือนที่เคยใช้
ฉันจะปรับแต่งอะไรได้บ้างในแท็บที่กำหนดเอง
ค่อนข้างมาก แท็บที่กำหนดเองช่วยให้คุณควบคุมเบราว์เซอร์ Chrome และประสบการณ์ของผู้ใช้ได้ละเอียด คุณเปิดแท็บที่กำหนดเองภายในแอปโดยใช้ Intent เมื่อเรียก Intent นี้ คุณสามารถเพิ่มแอตทริบิวต์จํานวนหนึ่งลงใน CustomTabIntent เพื่อให้ได้ประสบการณ์การใช้งานที่คุณต้องการ การปรับแต่งบางอย่างที่คุณเพิ่มได้แสดงอยู่ที่นี่
- ภาพเคลื่อนไหวสำหรับการเข้าและออกที่กำหนดเองเพื่อให้เข้ากับส่วนอื่นๆ ของแอป
- การปรับสีแถบเครื่องมือให้เข้ากับการสร้างแบรนด์ของแอป
- การใช้สีที่สอดคล้องกันซึ่งใช้ได้กับแอปของคุณ แม้ว่าผู้ใช้จะสลับระหว่างธีมมืดและธีมสว่าง
- การทำงานและรายการที่กำหนดเองในแถบเครื่องมือและเมนูของเบราว์เซอร์
- ควบคุมความสูงของแท็บที่กำหนดเองเมื่อเปิดใช้งาน ซึ่งจะเปิดใช้ฟีเจอร์ต่างๆ เช่น การสตรีมวิดีโอขณะโต้ตอบกับเว็บร้านค้า
นอกจากนี้ ผู้ใช้ยังย่อแท็บที่กำหนดเองเพื่อโต้ตอบกับแอปที่เกี่ยวข้อง และกู้คืนแท็บได้ทุกเมื่อโดยที่ความคืบหน้าจะไม่หายไปเพื่อใช้งานต่อ ซึ่งช่วยให้ผู้ใช้มีทางเลือกในการปิดแท็บที่กำหนดเองเพื่อให้ทำงานหลายอย่างได้ราบรื่นระหว่างเว็บกับแอปเนทีฟ โดยระบบจะเปิดใช้ฟีเจอร์นี้โดยค่าเริ่มต้นสำหรับแท็บที่กำหนดเอง
การดำเนินการดังกล่าวอยู่ไกลจากทุกสิ่ง แท็บที่กำหนดเองมีประสิทธิภาพสูงมากและอยู่ระหว่างการพัฒนา แต่ละเบราว์เซอร์จะต้องเพิ่มการรองรับฟีเจอร์เหล่านี้เมื่อพร้อมใช้งาน แม้ว่าเกือบทุกเบราว์เซอร์จะรองรับในระดับหนึ่ง แต่คุณก็ควรทราบว่าฟีเจอร์ใดบ้างที่อาจหรือไม่พร้อมใช้งานในเบราว์เซอร์ของผู้ใช้ โปรดดูตารางเปรียบเทียบฟีเจอร์เพื่อตรวจสอบความพร้อมให้บริการของฟีเจอร์ต่างๆ ในเบราว์เซอร์ Android ยอดนิยมได้อย่างรวดเร็ว
คุณทดสอบได้แล้วตอนนี้ด้วยตัวอย่างใน GitHub
ฉันควรใช้แท็บที่กำหนดเองเมื่อใด
ไม่มีการโหลดเนื้อหาบนเว็บที่ "ถูกต้อง" เพียงวิธีเดียว ในบางสถานการณ์ WebView จะเป็นเทคโนโลยีที่เหมาะสม เช่น หากคุณโฮสต์เนื้อหาของคุณเองภายในแอปแต่เพียงผู้เดียว หรือหากต้องการแทรก JavaScript จากแอปโดยตรง หากแอปของคุณนําผู้ใช้ไปยัง URL ภายนอกโดเมน สถานะที่แชร์ในตัวในแท็บที่กําหนดเองอาจเหมาะกว่า จุดแข็งอื่นๆ ของแท็บที่กำหนดเอง ได้แก่
- ความปลอดภัย: แท็บที่กำหนดเองใช้ Google Safe Browsing เพื่อปกป้องผู้ใช้และอุปกรณ์จากเว็บไซต์ที่เป็นอันตราย
- การเพิ่มประสิทธิภาพ
- อุ่นเบราว์เซอร์ไว้ล่วงหน้าในเบื้องหลัง โดยไม่แย่งทรัพยากรจากแอปพลิเคชัน
- เพิ่มความเร็วในการโหลดหน้าเว็บด้วยวิธีการโหลด URL แบบคาดเดาล่วงหน้า
- การจัดการวงจร: ระบบจะไม่นำแอปที่เปิดแท็บที่กำหนดเองออกในระหว่างการใช้งานแท็บ ความสำคัญของแท็บที่กำหนดเองจะเพิ่มขึ้นเป็นระดับเบื้องหน้า
- กล่องคุกกี้และรูปแบบสิทธิ์ที่แชร์เพื่อให้ผู้ใช้ไม่ต้องลงชื่อเข้าใช้เว็บไซต์ที่เชื่อมต่ออยู่แล้ว หรือให้สิทธิ์อีกครั้งหลังจากที่ให้ไปแล้ว
- ฟีเจอร์เบราว์เซอร์ เช่น ฟีเจอร์ป้อนข้อความอัตโนมัติเพื่อให้กรอกแบบฟอร์มได้ง่ายขึ้น พร้อมให้ใช้งานทันที
- ผู้ใช้สามารถกลับไปที่แอปได้โดยใช้ปุ่มย้อนกลับแบบรวม
แท็บที่กำหนดเองกับกิจกรรมในเว็บซึ่งเชื่อถือได้
กิจกรรมในเว็บซึ่งเชื่อถือได้จะขยายโปรโตคอลแท็บที่กำหนดเองและแชร์ประโยชน์ส่วนใหญ่ของโปรโตคอลดังกล่าว แต่แทนที่จะให้ UI ที่ปรับแต่งได้ ฟีเจอร์นี้ช่วยให้นักพัฒนาแอปเปิดแท็บเบราว์เซอร์ได้โดยไม่ต้องมี UI ใดๆ เลย เราขอแนะนําให้นักพัฒนาแอปที่ต้องการเปิด Progressive Web App ของตนเองในโหมดเต็มหน้าจอภายในแอป Android ของตนเอง
แท็บที่กำหนดเองพร้อมใช้งานที่ใดบ้าง
แท็บที่กำหนดเองเป็นฟีเจอร์ที่เบราว์เซอร์ในแพลตฟอร์ม Android รองรับ Chrome เปิดตัวฟีเจอร์นี้ในเวอร์ชัน 45 เบราว์เซอร์ Android ส่วนใหญ่รองรับโปรโตคอลนี้
เราต้องการความคิดเห็น คําถาม และข้อเสนอแนะเกี่ยวกับโปรเจ็กต์นี้ เราจึงขอแนะนําให้คุณรายงานปัญหาใน crbug.com และถามคําถามใน Twitter ที่ @ChromiumDev
ดูข้อมูลเพิ่มเติม
หากมีข้อสงสัย โปรดดูแท็ก chrome-custom-tabs ใน StackOverflow
ตัวอย่างเนื้อหาและโค้ดในหน้าเว็บนี้ขึ้นอยู่กับใบอนุญาตที่อธิบายไว้ในใบอนุญาตการใช้เนื้อหา Java และ OpenJDK เป็นเครื่องหมายการค้าหรือเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-07-27 UTC
[[["เข้าใจง่าย","easyToUnderstand","thumb-up"],["แก้ปัญหาของฉันได้","solvedMyProblem","thumb-up"],["อื่นๆ","otherUp","thumb-up"]],[["ไม่มีข้อมูลที่ฉันต้องการ","missingTheInformationINeed","thumb-down"],["ซับซ้อนเกินไป/มีหลายขั้นตอนมากเกินไป","tooComplicatedTooManySteps","thumb-down"],["ล้าสมัย","outOfDate","thumb-down"],["ปัญหาเกี่ยวกับการแปล","translationIssue","thumb-down"],["ตัวอย่าง/ปัญหาเกี่ยวกับโค้ด","samplesCodeIssue","thumb-down"],["อื่นๆ","otherDown","thumb-down"]],["อัปเดตล่าสุด 2025-07-27 UTC"],[],[],null,["# Overview of Android Custom Tabs\n\nCustom Tabs are a feature in Android browsers that gives app developers\na way to add a customized browser experience directly within their app.\n\nLoading web content has been a part of mobile apps since the early days of\nsmartphones, but older options can present challenges for developers. Launching\nthe actual browser is a heavy context switch for users that isn't customizable,\nwhile WebViews [don't support](https://research.google/pubs/pub46739/) all features of the web platform, don't share\nstate with the browser and add maintenance overhead.\n\nCustom Tabs lets users remain within the app while browsing, increasing\nengagement and reducing the risk of users abandoning the app. Custom Tabs are\npowered directly by the user's preferred browser and automatically share the\nstate and features offered by it. You don't need to write custom code to manage\nrequests, permission grants, or cookie stores.\n\nWhat can Custom Tabs do?\n------------------------\n\nBy using a Custom Tab, your web content loads in whatever rendering engine\npowers your user's preferred browser. Any API or web platform feature is\navailable there, and is available in your Custom Tab. Their browsing session,\nsaved passwords, payment methods, and addresses all show up just like they\nare accustomed to already.\n\nWhat can I customize in a Custom Tab?\n-------------------------------------\n\nQuite a bit! Custom Tabs give you fine grained control over a lot of the browser\nchrome and user experience. Within your app, you launch a Custom Tab using an\n[Intent](https://developer.android.com/guide/components/intents-filters). When this Intent is called, you can add a number of attributes to\nthe [CustomTabIntent](https://developer.android.com/reference/androidx/browser/customtabs/CustomTabsIntent) to get the exact experience you want. Some\ncustomizations that you can add are listed here:\n\n- Custom entrance and exit animations to match the rest of your app\n- Modifing the toolbar color to match your app's branding\n- Color consistency that can stay with your app, even if they switch between light and dark themes\n- Custom actions and entries to the browser's toolbar, and menus\n- Control the launch height of the Custom Tab, enabling things like streaming your videos while interacting with your web store\n\nIn addition, users can minimize a Custom Tab to interact with the underlying\napp, and restore it at any time without losing any progress to resume their\njourney. This gives users an alternative to closing the Custom Tab so they can\nseamlessly multitask between the web and the native app. The feature is\nenabled by default for Custom Tabs.\n\nThat is far from everything. Custom Tabs are very powerful, and under active\ndevelopment. Each browser needs to add support for these features as they become\navailable. While nearly all have some level of support, it is important to know\nwhat may or may not be available in your user's browsers. Refer to the\n[feature comparison table](/docs/android/custom-tabs/browser-support) to quickly\ncheck the availability of the different features across popular Android\nbrowsers.\n\nYou can test this now with our [sample](https://github.com/GoogleChrome/android-browser-helper/tree/master/demos/custom-tabs-example-app) on GitHub.\n\nWhen should I use Custom Tabs?\n------------------------------\n\nThere is no single \"correct\" way to load web content. In certain situations,\nWebView is going to be the right technology to use. For example, if you are\nexclusively hosting your own content inside your app, or if you need to inject\njavascript directly from your app. If your app directs people to URLs outside\ndomains, the built-in shared state in Custom Tabs means they are likely a\nbetter choice. Other strengths of Custom Tabs include:\n\n1. Security: Custom Tabs use Google's Safe Browsing to protect the user and the device from dangerous sites.\n2. Performance optimization:\n 1. Pre-warming of the Browser in the background, while avoiding stealing resources from the application.\n 2. Speed up the page load time by speculatively loading URLs in advance.\n3. Lifecycle management: Apps launching a Custom Tab won't be evicted by the system during the Tab's use. The importance of the Custom Tab is raised to the *foreground* level.\n4. Shared cookie jar and permissions model so users don't have to sign in to sites they are already connected to, or re-grant permissions they have already granted.\n5. Browser features like autofill for better form completion are available out-of-the-box.\n6. Users can return to app with an integrated back button.\n\nCustom Tabs versus Trusted Web Activity\n---------------------------------------\n\n[Trusted Web Activities](/develop/ui/views/layout/webapps/trusted-web-activities) extend the Custom Tabs protocol and shares most of\nits benefits. But, instead of providing a customized UI, it allows developers to\nopen a browser tab without any UI at all. It is recommended for developers who\nwant to open their own [Progressive Web App](https://web.dev/progressive-web-apps/), in full screen, inside their\nown Android app.\n\nWhere are Custom Tabs available?\n--------------------------------\n\nCustom Tabs is a feature supported by browsers on the Android platform. It was\noriginally introduced by [Chrome](https://play.google.com/store/apps/details?id=com.android.chrome), on version 45. The protocol is supported\nby most Android browsers.\n\nWe're looking for feedback, questions and suggestions on this project, so we\nencourage you to file issues on [crbug.com](https://crbug.com) and ask questions on Twitter\n[@ChromiumDev](https://twitter.com/ChromiumDev).\n\nLearn more\n----------\n\nFor questions, check the [chrome-custom-tabs](https://stackoverflow.com/questions/tagged/chrome-custom-tabs) tag on StackOverflow."]]
