ListView Weirdness -> https://www.dropbox.com/s/0xwkj7xje4agk3h/listview.mov?dl=0

list.js

'use strict';

const frameModule = require('ui/frame');
const Observable = require('data/observable').Observable;
const context = new Observable({});
const entryService = require('../../shared/services/entries');

let page;

exports.loaded = (args) => {
  page = args.object;
  page.bindingContext = context;

  entryService.get()
    .then(entries => {
      context.set( 'entries', entries );
    });
}

exports.refresh = (args) => {
  const pullRefresh = args.object;

  entryService.get({ refetch: true })
    .then(entries => {
      context.set( 'entries', entries );
      pullRefresh.refreshing = false;
    })
    .catch( error => {
      console.log(error);
      pullRefresh.refreshing = false;
    })
}

list.xml

<Page loaded="loaded"
  xmlns:components="components"
  xmlns:PullRefresh="nativescript-pulltorefresh"
  >
  <PullRefresh:PullToRefresh refresh="refresh">
    <ListView items="{{ entries }}">
      <ListView.itemTemplate>
        <GridLayout columns="60, *, 75" rows="25, 25, 25" style.verticalAlignment="top" padding="5">
            <Image src="{{ '~/images/' + fields.state + '.png' }}" col="0" row="0" rowSpan="3" width="50" height="50" />
            <Label text="{{ fields.name }}" textWrap="true" col="1" row="0" colSpan="2" class="headline"/>
            <components:date-range start="{{ fields.start }}" end="{{ fields.end }}" col="1" colSpan="2" row="1"/>
            <Label text="{{ fields.city }}" textWrap="true" col="1" row="2" class="city"/>
            <Label text="{{ fields.state }}" textWrap="true" col="2" row="2" class="state"/>
          </GridLayout>
      </ListView.itemTemplate>
    </ListView>
  </PullRefresh:PullToRefresh>
</Page>