feat: custom UI terms and conditions #569
Conversation
jokerttu
changed the title
There was a problem hiding this comment.
The Android version wasn’t building. I added a few suggestions that should resolve the Android build issues.
Native Navigation SDK for Android seems to have internal bug with uiParams as the background color always leaks outside of the panel where dropshadow should be.
There is example implementation of this feature to example pages, camera, navigation_without_map and turn_by_turn.
If possible it would be nice to have this on navigation and navigation_without_map example pages only to keep the example pages simple and as those are main navigation related example pages. What do you think?
Please add a new integration test in https://github.com/googlemaps/flutter-navigation-sdk/blob/main/example/integration_test/t02_session_test.dart
that verifies uiParams. Because the integration tests run on both platforms (Android emulator and iOS simulator), this should also help detect potential crashes in the native implementations.
iOS Test:
Android Test (after suggested fixes):
| ) | ||
| } | ||
| } | ||
|
|
There was a problem hiding this comment.
The codebase already has color conversion here:
https://github.com/googlemaps/flutter-navigation-sdk/blob/main/ios/google_navigation_flutter/Sources/google_navigation_flutter/Utilities.swift#L26-L37
See how it is used for example from here:
https://github.com/googlemaps/flutter-navigation-sdk/blob/main/ios/google_navigation_flutter/Sources/google_navigation_flutter/GMSPolygon%2BUtil.swift#L47
Please remove this change and use the existing conversion instead.
| title: String, | ||
| companyName: String, | ||
| shouldOnlyShowDriverAwarenessDisclaimer: Boolean, | ||
| uiParams: Messages.TermsAndConditionsUIParamsDto?, |
There was a problem hiding this comment.
| uiParams: Messages.TermsAndConditionsUIParamsDto?, | |
| uiParams: TermsAndConditionsUIParamsDto?, |
| title: String, | ||
| companyName: String, | ||
| shouldOnlyShowDriverAwarenessDisclaimer: Boolean, | ||
| uiParams: Messages.TermsAndConditionsUIParamsDto?, |
There was a problem hiding this comment.
| uiParams: Messages.TermsAndConditionsUIParamsDto?, | |
| uiParams: TermsAndConditionsUIParamsDto?, |
| // Build UI customization parameters if provided | ||
| val uiParams: TermsAndConditionsUIParams = | ||
| if (uiParams != null) { | ||
| val builder = TermsAndConditionsUIParams.builder() | ||
|
|
||
| // Apply custom colors if provided (convert from ARGB Long to Android Color Int) | ||
| uiParams.backgroundColor?.let { builder.setBackgroundColor(it.toInt()) } | ||
| uiParams.titleColor?.let { builder.setTitleColor(it.toInt()) } | ||
| uiParams.mainTextColor?.let { builder.setMainTextColor(it.toInt()) } | ||
| uiParams.acceptButtonTextColor?.let { builder.setAcceptButtonTextColor(it.toInt()) } | ||
| uiParams.cancelButtonTextColor?.let { builder.setCancelButtonTextColor(it.toInt()) } | ||
|
|
||
| builder.build() | ||
| } else { | ||
| TermsAndConditionsUIParams.builder().build() | ||
| } | ||
|
|
There was a problem hiding this comment.
| // Build UI customization parameters if provided | |
| val uiParams: TermsAndConditionsUIParams = | |
| if (uiParams != null) { | |
| val builder = TermsAndConditionsUIParams.builder() | |
| // Apply custom colors if provided (convert from ARGB Long to Android Color Int) | |
| uiParams.backgroundColor?.let { builder.setBackgroundColor(it.toInt()) } | |
| uiParams.titleColor?.let { builder.setTitleColor(it.toInt()) } | |
| uiParams.mainTextColor?.let { builder.setMainTextColor(it.toInt()) } | |
| uiParams.acceptButtonTextColor?.let { builder.setAcceptButtonTextColor(it.toInt()) } | |
| uiParams.cancelButtonTextColor?.let { builder.setCancelButtonTextColor(it.toInt()) } | |
| builder.build() | |
| } else { | |
| TermsAndConditionsUIParams.builder().build() | |
| } | |
| // Build UI customization parameters if provided | |
| val termsUiParams: TermsAndConditionsUIParams? = | |
| uiParams?.let { | |
| TermsAndConditionsUIParams.builder() | |
| .apply { | |
| it.backgroundColor?.let { color -> setBackgroundColor(color.toInt()) } | |
| it.titleColor?.let { color -> setTitleColor(color.toInt()) } | |
| it.mainTextColor?.let { color -> setMainTextColor(color.toInt()) } | |
| it.acceptButtonTextColor?.let { color -> setAcceptButtonTextColor(color.toInt()) } | |
| it.cancelButtonTextColor?.let { color -> setCancelButtonTextColor(color.toInt()) } | |
| } | |
| .build() | |
| } |
| if (shouldOnlyShowDriverAwarenessDisclaimer) { | ||
| val defaultParams: TermsAndConditionsUIParams = TermsAndConditionsUIParams.builder().build() | ||
| NavigationApi.showTermsAndConditionsDialog( | ||
| getActivity(), | ||
| companyName, | ||
| title, | ||
| defaultParams, | ||
| uiParams, | ||
| { accepted -> callback(Result.success(accepted)) }, | ||
| TermsAndConditionsCheckOption.SKIPPED, | ||
| ) | ||
| } else { | ||
| NavigationApi.showTermsAndConditionsDialog(getActivity(), companyName, title) { accepted -> | ||
| callback(Result.success(accepted)) | ||
| } | ||
| NavigationApi.showTermsAndConditionsDialog( | ||
| getActivity(), | ||
| companyName, | ||
| title, | ||
| uiParams, | ||
| { accepted -> callback(Result.success(accepted)) }, | ||
| ) | ||
| } |
There was a problem hiding this comment.
I couldn’t create a single GitHub suggestion covering the whole function, so I’m sharing these changes in separate parts. This one you must add manually as github did not allow to cover unchanges code part in suggestion.
The Android code failed to compile for multiple reasons. see check output. One issue was that showTermsAndConditionsDialog was invoked with an incorrect method signature in the else branch.
val checkOption =
if (shouldOnlyShowDriverAwarenessDisclaimer) TermsAndConditionsCheckOption.SKIPPED
else TermsAndConditionsCheckOption.ENABLED
NavigationApi.showTermsAndConditionsDialog(
getActivity(),
companyName,
title,
termsUiParams,
{ accepted -> callback(Result.success(accepted)) },
checkOption,
)3 participants
Fixes #489
Implemented Parameters
backgroundColor- Dialog background colortitleColor- Title text colormainTextColor- Main terms text coloracceptButtonTextColor- Accept button text colorcancelButtonTextColor- Cancel button text colorNot Implemented
Typography (Cross-platform)
More complex problem that can be handled in different PR
Title font (Android:
setTitleTypeface(), iOS:titleFont)Main text font (Android:
setMainTextTypeface(), iOS:mainTextFont)Button font (Android:
setButtonsTypeface(), iOS:buttonsFont)Text Sizes (Android only)
Android only can be handled in different PR
setTitleTextSize()- Title text sizesetMainTextTextSize()- Main text sizesetButtonsTextSize()- Button text sizePre-launch Checklist