{N} + Angular: Android SpeedView Plugin Setup


#1

Hi,

I’m new to {N} and Android development and am trying to figure out how to properly configure the SpeedView plugin via Gradle for Android found at https://github.com/anastr/SpeedView. I am using {N} + Angular. When I run tsc --version I get 2.5.4.

Please note that I am able to get as far as having the gauge appear in my view. However, function calls on the gauge do not error out but have no effect on the gauge (i.e., speedTo(100) has no effect for but console.logs indicate it is hitting this call). My initialization code for the gauge looks like this but is basically a shot in the dark:

export class GaugeView extends View {
  private _android: any;

  constructor() {
    super();
  }

  public get android() {
    return this._android;
  }

  public get _nativeView() {
    return this._android;
  }

  public _createUI() {
    this._android = new SpeedView(app.android.context);
  }

  public set value(value: number) {
    if (this._android) {
      this._android.speedTo(value);
    }
  }

  public set maxValue(value: number) {
    if (this._android) {
      this._android.setMaxSpeed(value);
    }
  }

  public set minValue(value: number) {
    if (this._android) {
      this._android.setMinSpeed(value);
    }
  }
}

Based on the instructions at https://github.com/anastr/SpeedView/wiki/1.-SpeedView, does anyone know how I might configure properly? In particular, I’m not sure how to translate the code:

SpeedView speedView = (SpeedView) findViewById(R.id.speedView);

Thanks in advance.


#2

@bradwaynemartin @NathanaelA @triniwiz @roblav96 any ideas to go on for Rick here? Always curious with these Android setups like this.


#3

Yep. I actually wrote a plugin :slight_smile: never published it. I’ll check later, it’s on my PC. @Pete.K might remember when I was working on it.


#4

@rwaterman you won’t need to worry about findViewById in the android sense. That’s if you had it defined in an Android layout file. Also your constructor needs the full path to the class. So find the namespace.whatever.SpeedView constructor. That will be in your createUI function. I prefer to create a constant for a class in my plugins if I’m going to reuse it so const Speed view = blah.blah.SpeedView then just use the constant for the class when needed.


#5

Thanks! Let me know what you find. I should have included this but right above the export, I am doing the following to initialize the SpeedView const:

const SpeedView = com.github.anastr.speedviewlib.SpeedView;


#6

I haven’t looked for the old code I had but I vaguely remember there being something to getting the gauge to animate. There was a throttle method or something that made the needle animate slightly at the set value. I’ll look at the source again and see if memory is serving me well :slight_smile:


#7

I deleted the old code :frowning: - wish I had published it now but I was a jackass and didn’t for some stupid reason.

At any rate - look at this plugin for Gifs : https://github.com/bradmartin/nativescript-gif/blob/master/gif.android.ts#L97 - I think that’s something similar with the speedview gauges. @rwaterman @wwwalkerrun

So while you have this._android to the SpeedView instance it’s likely something else, because your code checks out :thumbsup:. If you don’t want to go find the source for this on the lib - use console.dump(this._android) when you call the event and see if it has the methods exposed that you are calling.

Again, I haven’t confirmed this, just a hunch since you mention nothing happening. I’ll peek at the source later if you’re still stuck on it.


#8

yep so the methods are called on the Gauge
-https://github.com/anastr/SpeedView/blob/master/speedviewlib/src/main/java/com/github/anastr/speedviewlib/base/Gauge.java#L543


#9

I just found the old code :slight_smile: give me a few and I’ll post some snippets here. Also if you wanna throw a repo up with the plugin and need some help I can help there.


#10

@rwaterman @wwwalkerrun - here is the old code I did and it still works. The lib could have some changes that make it behave differently - but this works :slight_smile:

This might help with the lib - https://github.com/anastr/SpeedView/wiki/0.-Get-Started


#11

Awesome, this will work. thank you @bradwaynemartin!