Intro

This article provides an overview of the topics that have been added or changed based on the controls available in the SAP BTP SDK for Android.

SAP BTP SDK for Android 6.0

Updates to Guideline Structure

Navigation and Search

The Navigation Bar, Navigation Drawer, Navigation Rail, Search, and Top App Bar guideline articles are located within the Navigation and Search section under UI Components.

New guideline structure for Navigation and Search
New guideline structure for Navigation and Search

Foundations

Iconography

New icon set! SAP icons have been redesigned for the Horizon visual theme with a fresh, friendly, and bold style. The new icons maintain consistency of size, stroke, and visual balance and are tailored for simple and direct user interaction, using metaphors that are easy to understand in an enterprise setting. To learn more, refer to Icons.

Sample icons from new icon set
Sample icons from new icon set

UI Components & Patterns

Banners

Error state enhancement! Added error state for banners. A banner error state can be used to provide a page-level error message. For example, it is used in the Inline Edit flow for data tables.

Sample banner error state
Sample banner error state

Data Table – Inline Edit

Feature enhancement! In the inline edit mode, users can edit multiple lines without opening the key object cell view. Currently, the inline edit mode is available for text, List Picker, and Time Picker.

Activate the inline edit mode and select a text cell
Activate the inline edit mode and select a text cell

Navigation Drawer

New component! The navigation drawer provides access to different destinations in an app. Navigation drawers can be permanently visible or opened and closed by tapping a menu icon. Refer to Navigation Drawer to learn more.

Sample navigation drawer on mobile
Sample navigation drawer on mobile

Navigation Rail

New component! The navigation rail provides a top-level navigation to three to seven core destinations in an app. To learn more, refer to Navigation Rail.

Sample navigation rail on tablet
Sample navigation rail on tablet

Onboarding – Single-user Onboarding & Multi-User Onboarding

  • Updated pattern! Added guidance for splash screen.
  • Updated pattern! Updated launch screen with optional new EULA flow. A new dialog design to comply with China’s legal requirements.
  • Updated pattern! Increased content width for tablet/large screens.
Launch screen with new EULA section
Launch screen with new EULA section

Progress Indicators – Linear Progress Indicator

Updated component! The linear progress indicator has been updated to the latest SAP Fiori for Android visual style with support for error and success states. See Linear Progress Indicator.

Linear progress indicator with success state behavior
Linear progress indicator with success state behavior

Switches

Updated component! The switch control is updated to M3 style, which provides better accessibility. See Switches.

Enabled switch form cells
Enabled switch form cells

Resources

SAP Fiori for Android UI Kit 6.0

Updated Figma UI Kit with new components and enhancements for this release, including:

  • New Updates page documenting release updates in the UI Kit.
  • Grouped Navigation Bar, Navigation Drawer, Navigation Rail, Search, and Top App Bar into Navigation & Search page.
  • Info Card for each component documenting the basic information about the component and major change history.
Info card for banner
Info card for banner

SAP BTP SDK for Android 5.1

Foundations

Theming

New feature! Theming capability allows you to use a color palette to define a system-wide appearance. This visual experience can be leveraged to enhance readability in certain lighting environments and to express your unique product branding across platforms.

UI Components & Patterns

Card – Data Table Card

New component! A new card type in our Cards section provides a preview of data table in card format.

Navigation Bar

New component! The navigation bar provides fast access to two to five core destinations in an app.

Onboarding – Single-user Onboarding & Multi-User Onboarding

  • Updated pattern! Enhanced dark theme EULA screen.
  • Updated articles! Renamed Onboarding to Single-User Onboarding, added new flow charts and grouped the Single-User Onboarding and Multi-User Onboarding into the Onboarding section under Patterns.

Top App Bar

New component! The top app bar contains actions and content based on the current screen in an app.

Resources

SAP Fiori for Android UI Kit 5.1 (Figma)

Updated Figma UI Kit with new components and enhancements for this release, including:

  • New Updates page documenting release updates in the UI Kit.
  • Tutorial for Theming under Foundations section.
  • Screen samples showcasing how components can be put together for an application under the Floorplans section.