Questions on UI for Xamarin Forum

5 answers

299 views

Am I missing something? I don't see how to add plus minus button without using dataform. Is there a standalone control for this that I can use in xamarin forms?

thanks much

DataForm

answered on 17 Nov 2017

5 answers

283 views

Load on Demand - manual button does not appear

Hi,

I am using Load on Demand functionality in manual mode. I am customizing Load and Loading indicators. However, Loading indicator never shows, and after one load, the Load indicator does not reappear.

Sample XAML code is below

<telerikDataControls:RadListView x:Name="PeopleListView"

BackgroundColor="White"

ItemsSource="{Binding Employees}"

IsLoadOnDemandEnabled="True"

LoadOnDemand="Handle_LoadOnDemand"

LoadOnDemandMode="Manual"

IsItemSwipeEnabled="True"

ItemSwiping="PeopleListView_ItemSwiping"

SwipeOffset="160, 0, 0, 0"

SwipeThreshold="10"

SelectionGesture="Tap"

SelectionMode="Single"

SelectionChanged="PeopleListView_SelectionChanged"

IsVisible="{Binding IsBusy, Converter={StaticResource InverseBoolConverter}">

<telerikDataControls:RadListView.ItemTemplate>

<DataTemplate>

<telerikListView:ListViewTemplateCell>

<telerikListView:ListViewTemplateCell.View>

<Grid BackgroundColor="White">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"></ColumnDefinition>

<ColumnDefinition Width="*"></ColumnDefinition>

<ColumnDefinition Width="Auto"></ColumnDefinition>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinition Height="Auto"></RowDefinition>

<RowDefinition></RowDefinition>

</Grid.RowDefinitions>

<Image Source="{Binding PhotoData}"

Grid.RowSpan="2"

Grid.Column="0"

HeightRequest="70"

WidthRequest="70"></Image>

<Label Grid.Column="1" Grid.Row="0" Margin="0,3,0,0"

FontSize="Medium" Text="{Binding FullName}"></Label>

<Label Grid.Column="1" Grid.Row="1"

VerticalTextAlignment="Start" VerticalOptions="Start"

Text="{Binding EmployeeTitle}"></Label>

<Image Grid.Column="2" Grid.Row="0" Grid.RowSpan="2" Source="icon"

WidthRequest="30" HeightRequest="30">

<Image.GestureRecognizers>

<TapGestureRecognizer Tapped="Handle_Tapped"></TapGestureRecognizer>

</Image.GestureRecognizers>

</Image>

</Grid>

</telerikListView:ListViewTemplateCell.View>

</telerikListView:ListViewTemplateCell>

</DataTemplate>

</telerikDataControls:RadListView.ItemTemplate>

<telerikDataControls:RadListView.LoadOnDemandItemTemplate>

<DataTemplate>

<Grid BackgroundColor="Red">

<Label FontSize="24" HorizontalOptions="Center" Text="Load more" TextColor="Navy"></Label>

</Grid>

</DataTemplate>

</telerikDataControls:RadListView.LoadOnDemandItemTemplate>

<telerikDataControls:RadListView.LoadingOnDemandItemTemplate>

<DataTemplate>

<Grid BackgroundColor="Green">

<Label FontSize="24" HorizontalOptions="Center" Text="... Loading ..." TextColor="Navy"></Label>

</Grid>

</DataTemplate>

</telerikDataControls:RadListView.LoadingOnDemandItemTemplate>

</telerikDataControls:RadListView>

The sample load handler is below

async void Handle_LoadOnDemand(object sender, System.EventArgs e)

{

await Task.Delay(4000);

var service = new MockEmployeeService();

var data = service.GetEmployees();

int i = 0;

foreach (var item in data)

{

i++;

item.EmployeeTitle = "LOD " + i;

item.FirstName = "LOD " + i;

((ViewModel)this.BindingContext).Employees.Add(item);

}

The sample project is attached - project. Please let me know how to resolve this - I suspect I'm missing something in XAML, etc.

Thank you very much.

ListView

answered on 16 Nov 2017

3 answers

209 views

Delete Row - UI Bug

Good Day,

I think I found a bug in the DataGrid.
When you remove an item from the Datagrids itemsource bound ObservableCollection, the datagrid deletes the wrong item. So I started to debugged it => after the delete the itemsource is right but the view you see is wrong. (maybe a caching bug?)

You can easily reproduce this bug if you take your FirstLook example project.
Remove the label on top and add an button instead. Make a property for selectedItem in the mainViewmodel and bind it to the datagrids selected item.
On button click you do:

ViewModel.OrderDetails.Remove(ViewModel.Selected);

Here is the code:

namespace Examples.DataGrid.FirstLook

{

public partial class Example : ContentPage

{

public MainViewModel ViewModel { get; set; }

public Example()

{

InitializeComponent();

ViewModel = new MainViewModel();

this.BindingContext = ViewModel;

}

protected override void OnAppearing()

{

base.OnAppearing();

var rootGrid = this.Content as Grid;

if (Examples.Helpers.ExampleHelper.SetImageButtonOnTop(ref rootGrid))

{

this.Content = rootGrid;

}

private void Button_OnClicked(object sender, EventArgs e)

{

ViewModel.OrderDetails.Remove(ViewModel.Selected);

}

<?xml version="1.0" encoding="utf-8" ?>

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"

xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

xmlns:telerikDataGrid="clr-namespace:Telerik.XamarinForms.DataGrid;assembly=Telerik.XamarinForms.DataGrid"

xmlns:common="clr-namespace:Telerik.XamarinForms.Common.Data;assembly=Telerik.XamarinForms.Common"

xmlns:examples="clr-namespace:Examples;assembly=Examples"

x:Class="Examples.DataGrid.FirstLook.Example">

<Grid>

<Grid.BackgroundColor>

<OnPlatform x:TypeArguments="Color">

<OnPlatform.Android>White</OnPlatform.Android>

</OnPlatform>

</Grid.BackgroundColor>

<Grid.Behaviors>

<examples:CustomBehavior />

</Grid.Behaviors>

<Grid.Resources>

<ResourceDictionary>

<examples:UwpImageSourceConverter x:Key="UwpImageSourceConverter"/>

</ResourceDictionary>

</Grid.Resources>

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="58"/>

<RowDefinition/>

</Grid.RowDefinitions>

<Button Text="Delete selected Pos" Clicked="Button_OnClicked"></Button>

<telerikDataGrid:RadDataGrid Grid.Row="1"

ItemsSource="{Binding OrderDetails}"

AutoGenerateColumns="False"

SelectionUnit="Row"

SelectionMode="Single"

UserEditMode="Cell"

SelectedItem="{Binding Selected, Mode=TwoWay}">

<telerikDataGrid:RadDataGrid.Columns>

<telerikDataGrid:DataGridTemplateColumn HeaderText="Ship owner">

<telerikDataGrid:DataGridTemplateColumn.CellContentTemplate>

<DataTemplate>

<Image Source="{Binding EmployeeImage, Converter={StaticResource UwpImageSourceConverter}}"

Aspect="AspectFit"

Margin="0, 2, 0, 2"

WidthRequest="50"

HeightRequest="50"/>

</DataTemplate>

</telerikDataGrid:DataGridTemplateColumn.CellContentTemplate>

</telerikDataGrid:DataGridTemplateColumn>

<telerikDataGrid:DataGridNumericalColumn PropertyName="OrderID" HeaderText="Order ID"/>

<telerikDataGrid:DataGridTextColumn PropertyName="ShipName" HeaderText="Ship name"/>

</telerikDataGrid:RadDataGrid.Columns>

</telerikDataGrid:RadDataGrid>

</Grid>

</ContentPage>

namespace Examples.DataGrid.FirstLook

{

public class MainViewModel

{

public MainViewModel()

{

this.OrderDetails = DataGenerator.GenerateOrderDatails();

}

public ObservableCollection<Order> OrderDetails { get; set; }

public Order Selected { get; set; }

}

DataGrid

answered on 16 Nov 2017

1 answer

111 views

how to set dayview item text size on adroid?

Hey guys,

I'm having an issue setting the dayview (day) schedule item text size on android (on xamarin.forms)?

im currently using the 'calendar_NativeControlLoaded' event to set the style.

i've tried all styles but nothing seems to work as follows:

I'm using the 1103 version of telerik and the latest xamarin forms versions.

regards
Steve

Calendar & Scheduling

answered on 16 Nov 2017

4 answers

204 views

How to release memory used by Image returned by converter in RadListView

I have this list xaml:

When the page goes out of scope, the Images will not released. This is related to the fact that they are returned by the converter - if I replace the image with a static image, like

Then there is no memory leak.

The problem, I cannot access the Image objects to null out the source of each. RadListView seems to have no way to traverse it's children.

This seems to be a bug in RadListView.

ListView

answered on 14 Nov 2017

1 answer

126 views

Appointments don't show in month view

I have an appointment showing in day view, but in month view the cells are empty.

Why might this be?

Calendar & Scheduling

answered on 13 Nov 2017

1 answer

105 views

Disable holidays in datapicker

Hey Guys,
I need to customize the datepicker calendar so that it could have a bindableproperty to hold a list of holidays which should be disabled in the datepicker. It will need a custom renderer, but i don't know exactly the required code to implement this in iOS and Android projects? Any help is much appreciated

General Discussions

answered on 13 Nov 2017

1 answer

286 views

[ReadOnly] CheckBox

I have the following but it appears the ReadOnly Attribute is ignored?

        [DisplayOptions(Position = 3, ColumnPosition = 0, Header = "Completed")]
        [ReadOnly]
        public bool COMPLETED { get; set; }

DataForm

answered on 10 Nov 2017

2 answers

137 views

No NuGets available

Im having troubles installing nugets. I did follow the documentation tried both ways of inputing Credentials the nuget list is still empty. Is someone having the same issue ?

General Discussions

answered on 10 Nov 2017

4 answers

251 views

NSRangeException while loading data

I am having following error while using native iOS phones (but it is not happening on iPhone Simulator)

-[TKDataSource itemAtIndex:forSection:]

NSRangeException: *** -[__NSArrayM objectAtIndexedSubscript:]: index 12 beyond bounds [0 .. 0]

Below is the XAML I am using:

<telerikDataControls:RadListView Grid.Row="2" VerticalOptions="StartAndExpand" LoadOnDemandMode="Manual"

ItemsSource="{Binding Records}"

SelectedItem="{Binding SelectedRecord}"

IsLoadOnDemandEnabled="true" IsPullToRefreshEnabled="false">

<telerikDataControls:RadListView.ItemTemplate>

<DataTemplate>

<telerikListView:ListViewTemplateCell>

<telerikListView:ListViewTemplateCell.View>

<Grid>

<StackLayout Spacing="2" Margin="20,5,5,5">

<Label Text="{Binding Title}" FontSize="16" LineBreakMode="TailTruncation" FontAttributes="Bold" />

<Label Text="{Binding Subtitle}" LineBreakMode="TailTruncation" FontSize="14" TextColor="Gray" />

</StackLayout>

</Grid>

</telerikListView:ListViewTemplateCell.View>

</telerikListView:ListViewTemplateCell>

</DataTemplate>

</telerikDataControls:RadListView.ItemTemplate>

<telerikDataControls:RadListView.LayoutDefinition>

<telerikListView:ListViewLinearLayout ItemLength="50" />

</telerikDataControls:RadListView.LayoutDefinition>

</telerikDataControls:RadListView>

Below is the ViewModel.cs which sets Records:

private ObservableCollection<ViewRecordItem> _records=new ObservableCollection<ViewRecordItem>();

public ObservableCollection<ViewRecordItem> Records { get => _records; set { _records = value; OnPropertyChanged(); } }

private async Task Search(bool isNew = true) {

try

{

IsBusy = true;

CanRefresh = true;

if (isNew) _page = 1; else _page++;

ViewRecordItem[] recs = await svc.GetViewRecordItems(MyViewItem, page: _page, filter: GetFilters());

if (isNew) Records.Clear();

if (recs.Length == 0)

{

throw new Exception("Search could find any record.");

}

foreach (var rec in recs)

{

Records.Add(rec);

}

catch (Exception ex)

{

AlertService.Instance.ShowMsg(ex.Message);

CanRefresh = false;

}

IsBusy = false;

}

Below is the crash report from Mobile Center

CoreFoundation __exceptionPreprocess

libobjc.A.dylib objc_exception_throw

CoreFoundation _CFThrowFormattedException

CoreFoundation -[__NSArrayM objectAtIndexedSubscript:]

ExelareMobile.iOS -[TKDataSource itemAtIndex:forSection:]

ExelareMobile.iOS -[TKDataSource listView:cellForItemAtIndexPath:]

ExelareMobile.iOS -[TKListView collectionView:cellForItemAtIndexPath:]

UIKit-[UICollectionView _createPreparedCellForItemAtIndexPath:withLayoutAttributes:applyAttributes:isFocused:notify:]

UIKit-[UICollectionView _updateVisibleCellsNow:]

UIKit-[UICollectionView layoutSubviews]

UIKit-[UIView(CALayerDelegate) layoutSublayersOfLayer:]

ListView - Xamarin.iOS

answered on 10 Nov 2017