ActionBar Water Mark


#1

Hello i am currently developing an Application and i am using ActionBar on every Screen

The problem is that the Actionbar leaves a water mark… how do i explain this better, it leaves a rectangle showing the action bar and i want this rectangle to dissapear and i can’t manage to do it.

On my Action bar Title: “Define Date Period” with the -Navigation Button you can see a rectangle appearing near it…

My html code:

<FlexboxLayout flexDirection="column">
    <ActionBar fontSize="30" title="Define Date Period" backgroundColor="transparent" color="white">
        <NavigationButton text="Go Back" android.systemIcon="ic_menu_back" (tap)="onNavBtnTap()"></NavigationButton>
    </ActionBar>
    <StackLayout orientation="vertical" flexGrow="1" backgroundColor="transparent">
        <StackLayout marginTop="10" marginLeft="20" marginRight="20" backgroundColor="white">
            <label text="Initial Date"></label>
            <Button text="22-03-05" class="saveBtn" (tap)="setInitialDate()"></Button>
        </StackLayout>
        <StackLayout marginTop="10" marginLeft="20" marginRight="20" backgroundColor="white">
            <label text="End Date"></label>
            <Button text="22-03-05" class="saveBtn" (tap)="setEndDate()"></Button>
        </StackLayout>
    </StackLayout>
    <FlexboxLayout>
        <BottomBar row="1" [items]="items" [hide]="hidden" [titleState]="titleState" (loaded)="tabLoaded($event)" (tabSelected)="tabSelected($event)"
            [inactiveColor]="inactiveColor" [accentColor]="accentColor" colored="true"></BottomBar>
    </FlexboxLayout>
</FlexboxLayout>

Does anyone have any idea why this mark appears?


#2

Still didnt figure this out, anyone got any tip that could help me?

Would appreciate thanks!


#3

Try moving your ActionBar outside of your FlexboxLayout.

<ActionBar>
...
</ActionBar>
<FlexboxLayout>
...
</FlexboxLayout>

Edit: Forget it, the issue is the BackgroundColor=“transparent”. Not sure what there is causing it.


#4

Thanks for the reply. I already tried moving the actionbar outside of the FlexBox Layout but i got no results and yes i agree it is related to the BackgroundColor = transparent.

But i dont see how to get rid of that mark. Thanks for the help anyways!