Pull to refresh is not working in Tablet or Surface

[sreeman44]

I downloaded the Sample LLMListview and trying to run with simulator with touch mode.when i pull grid. grid is moving down. but refresh function is not calling( MasterListView.Refresh) and refresh image is not showing.As i have seen Pulltorefresh is enabled for Mobile device family (i.e AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile"). but i want to use this feature on the Windows tablet and windows Surface pro (may be Touch enable desktop also). Kindly help on this issue. And how can i move the FloatButton to top of the listview and center of the grid instated of bottom .

[brookshi]

I don't have surface, so I can't do any test, But you can try to change the code in 'Utils.cs', use Windows.UI.ViewManagement.UIViewSettings.UserInteractionMode instead of public static bool IsOnMobile => AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile";

[sreeman44]

I cannot remove public static bool IsOnMobile => AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile"; as IsOnMobile is used another files. so i changed above code as

public static bool IsOnMobile => (AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile" || AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Desktop" || AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Universal" || AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Team" || AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Xbox");

and tested it is working fine but i observed MasterListView.Refresh called multiple times and grid is loading multiple times can you review this code and update the NUGet package so that same can be used in my application.

And how can i move the FloatButton to top of the listview and center of the grid instated of bottom .

[brookshi]

It seems you want to use PullToRefresh in all devices, I think it's a particular requirement for you but not for common users, so sorry, I will not update NUGET packet for this change. I suggest you add reference this library to your application directly, so you can change code as what you want. MasterListView.Refresh called multiple times I don't know, the code that you add will not cause this. you should add breakpoint and check CallStack.

move the FloatButton to top of the listview and center of the grid instated of bottom For this, you can change code of 'theme/generic.xaml',

 <Border x:Name="FloatButtonBorder"
                                Margin="0, 0, 30, 50"
                                HorizontalAlignment="Right"
                                VerticalAlignment="Bottom"
                                Visibility="{TemplateBinding FloatButtonVisibility}">

to

 <Border x:Name="FloatButtonBorder"
                                Margin="0, 50, 0, 0"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Top"
                                Visibility="{TemplateBinding FloatButtonVisibility}">

And change anim setting:

<VisualState x:Name="FloatBtnCollapse">
                                    <Storyboard>
                                        <DoubleAnimation Duration="00:00:00.2"
                                                         From="0"
                                                         Storyboard.TargetName="FloatButtonBorderTransform"
                                                         Storyboard.TargetProperty="Y"
                                                         To="120">
                                            <DoubleAnimation.EasingFunction>
                                                <SineEase EasingMode="EaseOut" />
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="FloatBtnVisible">
                                    <Storyboard>
                                        <DoubleAnimation Duration="00:00:00.2"
                                                         From="120"
                                                         Storyboard.TargetName="FloatButtonBorderTransform"
                                                         Storyboard.TargetProperty="Y"
                                                         To="0">
                                            <DoubleAnimation.EasingFunction>
                                                <SineEase EasingMode="EaseIn" />
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                    </Storyboard>
                                </VisualState>

to

<VisualState x:Name="FloatBtnCollapse">
                                    <Storyboard>
                                        <DoubleAnimation Duration="00:00:00.2"
                                                         From="0"
                                                         Storyboard.TargetName="FloatButtonBorderTransform"
                                                         Storyboard.TargetProperty="Y"
                                                         To="-120">
                                            <DoubleAnimation.EasingFunction>
                                                <SineEase EasingMode="EaseOut" />
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="FloatBtnVisible">
                                    <Storyboard>
                                        <DoubleAnimation Duration="00:00:00.2"
                                                         From="-120"
                                                         Storyboard.TargetName="FloatButtonBorderTransform"
                                                         Storyboard.TargetProperty="Y"
                                                         To="0">
                                            <DoubleAnimation.EasingFunction>
                                                <SineEase EasingMode="EaseIn" />
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                    </Storyboard>
                                </VisualState>

[brookshi]

you want this PullToRefresh work like Android's(Material Design)? The float button is just a button used to click/touch, not for pulling to display

[sreeman44]

Thanks for code. my listview doesn't contains any header so when there is no data in the listview users cannot be identified the listview and cannot be pulled to refresh. so they will use this refresh button to refresh the grid.

[brookshi]

OK. May EmptyDataTemplate is another choice. you can check it in EmptyDataPage in demo.

<ctrl:LLMListView.EmptyDataTemplate>
                <DataTemplate>
                    <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap"
                               Text="List is empty" />
                </DataTemplate>
            </ctrl:LLMListView.EmptyDataTemplate>