ManeuverView update does not display anything

ben-j69 commented 5 years ago

When I use setManeuverTypeAndModifier on my ManeuverView it does not display anything.

Android API: minSdkVersion 16 targetSdkVersion 28 Mapbox Navigation SDK version: implementation com.mapbox.mapboxsdk:mapbox-android-sdk:7.1.2 implementation com.mapbox.mapboxsdk:mapbox-sdk-services:4.3.0 implementation com.mapbox.mapboxsdk:mapbox-android-plugin-annotation-v7:0.5.0 implementation com.mapbox.mapboxsdk:mapbox-android-navigation:0.30.0 implementation com.mapbox.mapboxsdk:mapbox-android-navigation-ui:0.30.0

Steps to trigger behavior

1.My view is defined in my layout : <com.mapbox.services.android.navigation.ui.v5.instruction.maneuver.ManeuverView android:id="@+id/maneuver_view" android:layout_width="90dp" android:layout_height="match_parent" app:maneuverViewPrimaryColor="@color/gray_text_v7" app:maneuverViewSecondaryColor="@color/gray_text_v7_trans_50" />

I update this view each time I get a BannerInstructionMilestone `override fun onMilestoneEvent(routeProgress: RouteProgress?, instruction: String?, milestone: Milestone?) { if (milestone is BannerInstructionMilestone) { updateBanner(milestone.bannerInstructions.primary()) } else if (milestone is VoiceInstructionMilestone) { //TODO } }

private fun updateBanner(bannerText: BannerText?) { if (bannerText == null) { return } maneuverView.setManeuverTypeAndModifier(bannerText.type()!!, bannerText.modifier()) val roundaboutAngle = bannerText.degrees() if (roundaboutAngle != null) { maneuverView.setRoundaboutAngle(roundaboutAngle.toFloat()) }
```
text_banner_primary.text = bannerText.text()
```
}`
1. The bannerText.type()!! is "turn" and bannerText.modifier() is "right" But it does not display anything even if updateManeuverView is called in ManeuverView

Expected behavior

Should draw a turn right arrow

Actual behavior

Display nothing

danesfeder commented 5 years ago

Hey @ben-j69 👋 thanks for the feedback. I wonder if this is a bug with the height / width measurement of the ManeuverView (your color setting looks fine).

Do you mind updating android:layout_height="match_parent" to android:layout_height="90dp" (like the set width you have)? Thanks!

ben-j69 commented 5 years ago

Thanks for the reply, I already tried with fixed sizes from 40dp/40dp to 240dp/240dp. In my case setting 90dp/90dp does not change anything.

Interesting facts: it was working well with the NavigationView from Mapbox sdk and the direction is also displayed correctly in the notification.

Is there a logic from ManeuverView that I don't understand? It is in my layout and I update it when I receive BannerInstructionMilestone.

danesfeder commented 5 years ago

@ben-j69 it sounds like you've added your MilestoneEventListener to MapboxNavigation fine as you're seeing the "turn" "right" data.

My next hunch would be the custom colors you're setting. Would you mind putting a breakpoint on https://github.com/mapbox/mapbox-navigation-android/blob/master/libandroid-navigation-ui/src/main/java/com/mapbox/services/android/navigation/ui/v5/instruction/maneuver/ManeuverView.java#L224-L227 and seeing with the debugger if this line is ever hit?

ben-j69 commented 5 years ago

I think I have found the issue, it is a strand drawing behaviour but I did not find yet a way to fix it.

I set the ManeuverView as the last element of my RelativeLayout, so it is above all my activity.

It display well in match_parent/match_parent, on all the screen, so I reduced the size little by little and this came up :

<com.mapbox.services.android.navigation.ui.v5.instruction.maneuver.ManeuverView android:foregroundGravity="top" android:id="@+id/maneuver_view" android:layout_width="50dp" android:layout_height="400dp" android:background="@color/red_error_50" app:maneuverViewPrimaryColor="@color/black" app:maneuverViewSecondaryColor="@color/white" />

width: 100 / height 500 Looks correct screen1

width 100 / height 400 The arrow is not drawn correctly, it is outside of the view: screen2

I try to display the arrow in a 100dp/100dp square view, have you an idea of a workarround ?

ben-j69 commented 5 years ago

@danesfeder did you succeed to reproduce this issue ?

danesfeder commented 5 years ago

@ben-j69 there is no rendering when you set 100dp/100dp?

ben-j69 commented 5 years ago

No rendering of the arrow on 100dp/100dp on top level relative layout, we can only see the red background of the ManeuverView 100

ben-j69 commented 5 years ago

@danesfeder I found a workaround, if I put a stupid ConstraintLayout outside of my ManeuverView it works well

fix

My edited code: `<android.support.constraint.ConstraintLayout android:layout_width="wrap_content" android:layout_height="wrap_content">

    <com.mapbox.services.android.navigation.ui.v5.instruction.maneuver.ManeuverView
        android:id="@+id/maneuver_view"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@color/red_error_50"
        app:maneuverViewPrimaryColor="@color/black"
        app:maneuverViewSecondaryColor="@color/white" />

</android.support.constraint.ConstraintLayout>`

So it looks like the ManeuverView can only work in a ConstraintLayout, this is an issue that should be fixed, what do you think ?

danesfeder commented 5 years ago

this is an issue that should be fixed, what do you think ?

Yes I agree, the parent layout should not affect the rendering of the ManeuverView.

No rendering of the arrow on 100dp/100dp on top level relative layout, we can only see the red background of the ManeuverView

Can you post the .xml that reproduces the rendering issue so we can reproduce and work on fixing? Thanks!

ben-j69 commented 5 years ago

@danesfeder I put the xml with the issue and the one with the "fix" in the archive.

But I think the most easy way to reproduce it is just to put a maneuverview in a relative layout.

I noticed that even in the Layout Editor of Android Studio if the ManeuverView is inside a ConstraintLayout an arrow is displayed in the Design tab. But the arrow is not displayed if the ManeuverView is inside a RelativeLayout ;)

Archive.zip

Guardiola31337 commented 4 years ago

@abhishek1508 is this still reproducible / an issue in the 1.0 UI SDK?

cc @JunDai

abhishek1508 commented 4 years ago

Let's verify. cc @JunDai @cafesilencio @langsmith

JunDai commented 4 years ago

@ben-j69 - this is still an issue in our UI SDK. But as you already figured out a workaround to not put the ManeuverView as a direct children of RelativeLayout should be fine. If your layout is happen to be using RelativeLayout as the root layout, I would suggest to use a LinearLayout or other layout to wrap the ManeuverView so you can avoid the issue before we fix it.

cc: @Guardiola31337 / @abhishek1508

mapbox / mapbox-navigation-android