rhanb / nativescript-bottombar

Fancy bottom bar for NativeScript :smile: :beers:
Apache License 2.0
65 stars 24 forks source link

BottomBar LABEL_VISIBILITY.SELECTED not working #85

Open MGalatioto opened 5 years ago

MGalatioto commented 5 years ago

`import { Component, OnInit } from "@angular/core"; import { RadSideDrawer } from "nativescript-ui-sidedrawer"; import * as app from "tns-core-modules/application"; import { BottomBar, LABEL_VISIBILITY, TabSelectedEventData } from "nativescript-bottombar"; import { Router } from "@angular/router";

@Component({ moduleId: module.id, selector: "aktuelle-module", templateUrl: "./aktuelle-module.component.html" }) export class AktuelleModuleComponent implements OnInit { globalVariables: any = global; private bottomBar: BottomBar; labelVisibility: LABEL_VISIBILITY; actualModules: any[];

constructor(private router: Router) {
    this.labelVisibility = LABEL_VISIBILITY.SELECTED;
    this.actualModules = this.globalVariables.actualModules;
}

ngOnInit() {}

onDrawerButtonTap() {
    const sideDrawer = <RadSideDrawer>app.getRootView();
    sideDrawer.showDrawer();
}

async tabSelected(event: TabSelectedEventData) {
    const tabbedIcon = event.newIndex;
    if (tabbedIcon === 0) {
        await this.router.navigate(["/dashboard"]);
    }
    if (tabbedIcon === 1) {
        await this.router.navigate(["/aktuelle-module"]);
    }
    if (tabbedIcon === 2) {
        await this.router.navigate(["/credits"]);
    }
    if (tabbedIcon === 3) {
        await this.router.navigate(["/info"]);
    }
}

barLoaded(event) {
    this.bottomBar = event.object;
}

} `

So when i click to 'aktuelle-module' the routing works, but the dashboard gets selected. Also, here the template of 'aktuelle-module'

`

<ScrollView height="90%">
  <StackLayout class="form">
    <StackLayout *ngFor="let currentModule of actualModules; index as i">
      <GirdLayout rows="auto, auto" columns="auto" class="gridActualModules">
          <GridLayout *ngIf="currentModule['Code'] !== ''" row="0" rows="auto" columns="4*, 6*">
            <Label fontWeight="bold" textWrap="true" row="0" col="0" text="Code"></Label>
            <Label row="0" col="1" [text]="currentModule['Code']"></Label>
          </GridLayout>
          <GridLayout *ngIf="currentModule['Course'] !== ''" row="1" rows="auto" columns="4*, 6*">
            <Label fontWeight="bold" textWrap="true" row="0" col="0" text="Modulname"></Label>
            <Label textWrap="true" row="0" col="1" [text]="currentModule['Course']"></Label>
          </GridLayout>
        </GirdLayout>
      <StackLayout class="hr-light"></StackLayout>
    </StackLayout>
  </StackLayout>
</ScrollView>

<BottomBar (tabSelected)="tabSelected($event)" [androidLabelVisibility]="labelVisibility" (loaded)="barLoaded($event)">
  <BottomBarItem icon="res://home" title="Dashboard" checkedIcon="res://home"></BottomBarItem>
  <BottomBarItem icon="res://document" title="Aktuelle Module" checkedIcon="res://document"></BottomBarItem>
  <BottomBarItem icon="res://credits" title="Credits" checkedIcon="res://credits"></BottomBarItem>
  <BottomBarItem icon="res://info" title="Info" checkedIcon="res://info"></BottomBarItem>
</BottomBar>

`

I'd Appreciate any help! If there are more infos necessary, please tell me!

rhanb commented 5 years ago

Hi @MGalatioto ,

Thanks for reporting this issue, could you provide a simple repo to reproduce the issue? it would be a great help for me to reproduce the issue and fix it đź‘Ť

Thanks

MGalatioto commented 5 years ago

Hi @rhanb

appreciate your answer! I have only a private repo, since this is a project for an employer - Would be a playground helpful for you as well (if thats even possible in a playground..)?

Thank you already in advance for your answer!

BR, Marco

MGalatioto commented 5 years ago

Hi @rhanb Here is a zip where the error occurs - i'd appreciate your help really much. Best regards - marco NSAPP-master.zip

MGalatioto commented 5 years ago

Hi again, @rhanb

I honestly did not find the "bug", I searched for it but unfortunately I could not find any :-(

Did you get time to get an eye on it? (zip file above in the comment)

Really would appreciate it!

Thanks in advance.

BR, Marco

MGalatioto commented 5 years ago

Hi @rhanb Could you take a look at this? (I attached the code in the .zip file above). Thank you.

rhanb commented 5 years ago

Hi @MGalatioto , sorry for taking so long to answer, Understand that it's hard for me to find time to work on this repo with my current work.

The best would be to have a github repo (can be private, it's free).

Otherwise from what I see from your html template I don't see any router-outlet nor page-router-outlet

routing can't work without one of those

MGalatioto commented 5 years ago

Hi @rhanb

Yes, I completley understand.

Thank you for checking it.

I do have a page-router-outlet in my app.component.html ...