Skip to content

Instantly share code, notes, and snippets.

@tjvantoll
Created August 21, 2017 21:34
Show Gist options
  • Save tjvantoll/fe9c629837c359d79875cb3689ae0632 to your computer and use it in GitHub Desktop.
Save tjvantoll/fe9c629837c359d79875cb3689ae0632 to your computer and use it in GitHub Desktop.

pt2

import { PokemonService } from "./pokemon/pokemon.service";

pt3

export class ListComponent implements OnInit {
  pokemonList;

  constructor(private pokemonService: PokemonService) {}

  ngOnInit() {
    this.pokemonService.list().then((data) => {
      this.pokemonList = data;
    });
  }
}

pt4

<ScrollView>
  <FlexboxLayout class="container">
    <Image *ngFor="let pokemon of pokemonList"
      [src]="pokemon.sprite"
      ></Image>
  </FlexboxLayout>
</ScrollView>

fl5

.container {
  flex-wrap: wrap;
  justify-content: space-around;
}

pt6

(tap)="onTap($event, pokemon)"

pt7

import { RouterExtensions } from "nativescript-angular/router";

pt8

onTap(event, pokemon) {
  this.router.navigate(["/detail", pokemon], {

  });
}
transition: {
  name: "curlUp",
  duration: 500
}

pt9

<FlexboxLayout justifyContent="center">
  <Image [src]="pokemon.sprite"></Image>
</FlexboxLayout>

pt10

import * as SocialShare from "nativescript-social-share";

pt11

<ActionItem text="Share" (tap)="share(event, pokemon)" android.systemIcon="ic_menu_share_holo_dark" ios.systemIcon="9" ios.position="right"></ActionItem>

pt12

share(event, pokemon) {
  SocialShare.shareImage(pokemon.sprite);
}

pt13

var explosion = require("nativescript-explosionfield");

pt14

explosion.explode(event.view);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment