Screwy android layout

7 posts, 0 answers
  1. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 31 Mar Link to this post

    Everything looks good on iOS, but on android it's like each listitem is taking up the entire page, and the swipe\left\right doesn't move the listitem at all, have a peek:

    http://www.screencast.com/t/nluDzkvLh

    I have tried on the pre-release 0.2.4, and the official latest version on npm (as of today)

    I've also tried removing the gridlayout and just putting the title in there, no diff... also on 1.0.1 the swipe code doesnt work (maybe the API changed, gonna check now)

    <Page xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:lv="nativescript-telerik-ui/listview" xmlns:drawer="nativescript-telerik-ui/sidedrawer" loaded="onPageLoaded" navigatingTo="onNavigatingTo" actionBarHidden="true">
    <drawer:RadSideDrawer id="drawer">
        <drawer:RadSideDrawer.mainContent>
          <GridLayout id="layout" rows="auto, auto, *">
                <StackLayout row="0" class="custom-actionbar" orientation="horizontal">
                    <Label text="" class="materialdesign hamburger" tap="onToggleDrawer" />
                    <Label text="Essential Clinical Encounters" textWrap="false" class="pagetitle" />
                </StackLayout>
                <SearchBar id="searchBar" row="1" hint="Search Encounters" text="{{ searchText }}" clear="onSearchClear" submit="onSearch" />
                <lv:RadListView row="2" items="{{ items }}" itemTap="onItemTap" swipeCells="true" itemSwipeProgressEnded="onSwipeEnded" pullToRefresh="true" pullToRefreshInitiated="pullToRefreshInitiated">
                    <lv:RadListView.listViewLayout>
                        <lv:ListViewLinearLayout scrollDirection="Vertical"/>
                    </lv:RadListView.listViewLayout>
                    <lv:RadListView.itemTemplate>
                        <GridLayout columns="30, *" class="list-item">
                            <Label col="0" text="{{ StatusIcon }}" class="status tag materialdesign" />
                            <StackLayout col="1">
                                <Label text="{{ Name }}" textWrap="false" />
                                <StackLayout orientation="horizontal">
                                    <Label text="{{ PatientTypeName }}" textWrap="false" class="patientType type" />
                                    <Label text="{{ RoleName }}" textWrap="false" class="roleName type" />
                                </StackLayout>
                            </StackLayout>
                        </GridLayout>
                    </lv:RadListView.itemTemplate>
                    <lv:RadListView.itemSwipeTemplate>
                            <GridLayout columns="auto, *, auto">
                                <Button col="0" style="background-color: #7fd3ab; color: white" text="Done"/>
                                <Button col="2" style="background-color: #7fd3ab; color: white" text="Done"/>
                            </GridLayout>
                        </lv:RadListView.itemSwipeTemplate>
                </lv:RadListView>
            </GridLayout>
        </drawer:RadSideDrawer.mainContent>
        <drawer:RadSideDrawer.drawerContent>
          <StackLayout class="drawer-content">
            <StackLayout class="header-content">
                <GridLayout columns="*, 30" rows="auto">
                    <Label text="Status" class="align-left text" col="0" />
                    <Label  text="" class="materialdesign align-right icon" col="1" tap="onToggleDrawer" />   
                </GridLayout>       
            </StackLayout>
            <StackLayout class="drawer-menu-content">
              <Label text="Required"/>
              <StackLayout class="seperator" />
              <Label text="All"/>
              <StackLayout class="seperator" />
              <Label text="Complete"/>
              <StackLayout class="seperator" />
              <Label text="Incomplete"/>
              <StackLayout class="seperator" />
            </StackLayout>
          </StackLayout>
        </drawer:RadSideDrawer.drawerContent>
      </drawer:RadSideDrawer>
    </Page>

  2. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 31 Mar in reply to Steve Link to this post

    Ah yeah "itemSwipe" not "swipeCells"
  3. Deyan
    Admin
    Deyan avatar
    2037 posts

    Posted 04 Apr Link to this post

    Hi Steve,

    Thanks for the ScreenCast videos. Is this happening with Telerik UI 1.0.1 but not with earlier versions (0.2.5)?
    Based on the XML layout you are pasting and the video I cannot exactly say why items take up the whole space and will need a way to reproduce it? Can you isolate the case in a separate project and send it here for further investigation? 

    Regards,
    Deyan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  4. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 04 Apr in reply to Deyan Link to this post

    Sent you the actual app on slack to try
  5. Deyan
    Admin
    Deyan avatar
    2037 posts

    Posted 05 Apr Link to this post

    Hello Steve,

    Thanks. Will close this one. Let's communicate on Slack regarding this case.

    Regards,
    Deyan
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Diego
    Diego avatar
    1 posts
    Member since:
    Aug 2014

    Posted 28 Apr Link to this post

    Hi, I have the same issue. The listItem is extended over entire page. Using simple demo app on http://developer.telerik.com/featured/building-polished-mobile-apps-telerik-ui-nativescript/ (RadListView section), you can reproduce this issue.

    Platform  Android
    tns --version   1.7.1
    "nativescript-telerik-ui": "^1.0.1"

    Any suggestion ?

  7. Bulent
    Admin
    Bulent avatar
    29 posts

    Posted 29 Apr Link to this post

    Hello Diego,

    We know about this issue and will investigate it in depth. We will inform you asap when it is fixed.
    Please, stay tuned and check our latest release 1.1.0 with Angular directives for ListView and Side drawer and many other fixes.

    Regards,
    Bulent
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top