Questions on UI for Xamarin Forum

2 answers

1.8K+ views

I'm essentially trying to recreate the xaml below from your example here. I've been successful in creating a Tree View and a TreeViewDescriptor using only C# (no xaml) but I haven't been able to figure out how to create a more complex Tree View using an Item Template. The ItemTemplate property for a TreeViewDescriptor has a type of DataTemplate and that class only seems to have the properties Values and Bindings. These properties wouldn't be enough for me to define my grid for displaying my data. Am I able to define an ItemTemplate programmatically?

1.

<telerikDataControls:RadTreeView x:Name="treeView"

ItemsSource="{Binding Source}">

<telerikDataControls:TreeViewDescriptor DisplayMemberPath="Name"

ItemsSourcePath="Cities"

TargetType="{x:Type local:Country}">

<telerikDataControls:TreeViewDescriptor.ItemTemplate>

<DataTemplate>

<Grid Margin="{Binding Path=Level, Converter={StaticResource levelToMarginConverter}}"

HeightRequest="40">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="Auto" />

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<telerikTreeView:ExpandCollapseIndicator FontSize="Medium"

WidthRequest="10"

Margin="15,0"

VerticalTextAlignment="Center"

IsLoading="{Binding Path=IsLoading}"

IsLoadOnDemandEnabled="{Binding Path=IsLoadOnDemandEnabled}"

IsExpanded="{Binding Path=IsExpanded}"

IsLeaf="{Binding Path=IsLeaf}" />

<Image Grid.Column="1"

VerticalOptions="Center"

Source="{Binding Item.Icon, Converter={StaticResource ImageSourceConverter}}" />

<telerikTreeView:ItemText Grid.Column="2"

Margin="8,0,0,0"

VerticalOptions="Center"

Text="{Binding Item.Name}" />

</Grid>

</DataTemplate>

</telerikDataControls:TreeViewDescriptor.ItemTemplate>

</telerikDataControls:TreeViewDescriptor>

<telerikDataControls:TreeViewDescriptor DisplayMemberPath="Name"

TargetType="{x:Type local:City}" />

</telerikDataControls:RadTreeView>

TreeView

answered on 14 Jan 2020

3 answers

275 views

Xamarin.Forms UI Template?

Hi there,

Wondering if it UI templates exist for all of the Xamarin.Forms elements? I have seen Photoshop templates provided in the past on other forums, so I wanted to check here as well. We are about to jump into a new project and having UI templates to leverage during the wireframing process would be a huge time saver. I currently use Sketch.

Thanks,

Bob

General Discussions

answered on 14 Jan 2020

4 answers

108 views

Closing datagrid filter pop-up after navigating away crashes app with null reference error.

Hello,

I think I have found a bug in your datagrid. If you open a datagrid's filter pop-up, navigate away from the page, then go back to the page, the filter pop-up will still be open. If you attempt to close it, by way of the "X", the app will crash. In debug mode, a null reference error will occur. If navigating away from the grid with the filter closed, no crash will happen. This happens both in a tabbed view, switching from one tab to to another and back, and in the xamarin shell navigation. This happens in both my app and the example app you provide.

Is there a way to close the filter pop-up upon un-focus or switching views or something?

Thanks

DataGrid

answered on 10 Jan 2020

6 answers

279 views

How To Bind To AutoCompleteView SelectedItems

[Our RadAutoCompleteView resides within a RadTreeView]

I'm trying to utilize the Tokens feature of the RadAutoCompleteView control for our POC and I'm unable to get a hold of the selected Tokens. At first, I tried data binding to the Tokens property (Mode=TwoWay) and my view model property was never being set after selecting any number of tokens. So, this might be another bug.

I gave up on trying to bind to Tokens (for now) and tried to utilize the code-behind to directly see which Tokens have been selected. Unfortunately, my named components are not visible to the code behind if they're under a DataTemplate inside a RadTreeView.

In the following code example, "TopicsTreeViewDescriptor" IS visible to the code-behind, but "TopicsExpandCollapseIndicator" (used simply for this test) and "TopicsAutoCompleteView" are NOT visible to the code-behind making it impossible for me to determine which Tokens have been selected.

<telerikDataControls:RadTreeView x:Name="TopicsTreeView" Grid.Row="2" ItemsSource="{Binding Topics}" CheckBoxMode="Propagate" WidthRequest="300">

<telerikDataControls:TreeViewDescriptor x:Name="TopicsTreeViewDescriptor" ItemsSourcePath="Items" DisplayMemberPath="DisplayName" TargetType="{x:Type v1:Topic}">

<telerikDataControls:TreeViewDescriptor.ItemTemplate>

<DataTemplate x:Name="TopicsDataTemplate">

<Grid>

<!--<Grid.RowDefinitions>

<RowDefinition/>

</Grid.RowDefinitions>-->

<Grid Margin="{Binding Path=Level, Converter={StaticResource LevelToMarginConverter}}"

HeightRequest="40"

IsVisible="{Binding Item.ShowAutoComplete, Converter={StaticResource InverseBooleanConverter}}">

<Grid.ColumnDefinitions>

<ColumnDefinition>

<ColumnDefinition.Width>

<OnPlatform x:TypeArguments="GridLength" Default="Auto">

<On Platform="UWP">45</On>

</OnPlatform>

</ColumnDefinition.Width>

</ColumnDefinition>

<ColumnDefinition Width="Auto" />

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<treeView:ExpandCollapseIndicator x:Name="TopicsExpandCollapseIndicator"

Grid.Column="0"

FontSize="Medium"

WidthRequest="10"

Margin="15,0"

VerticalTextAlignment="Center"

IsLoading="{Binding Path=IsLoading}"

IsLoadOnDemandEnabled="{Binding Path=IsLoadOnDemandEnabled}"

IsExpanded="{Binding Path=Item.Expanded, Mode=TwoWay}"

IsLeaf="{Binding Path=IsLeaf}"/>

<Image Grid.Column="1"

VerticalOptions="Center"

Source="{Binding Item.IconName, Converter={StaticResource ImageSourceConverter}}"

IsVisible="{Binding Item.ShowAutoComplete, Converter={StaticResource InverseBooleanConverter}}"/>

<primitives:RadCheckBox Grid.Column="1"

IsChecked="{Binding Path=Item.Checked, Mode=TwoWay}"

IsVisible="{Binding Path=Item.IsCheckBoxVisible}"

VerticalOptions="Center" />

<treeView:ItemText Grid.Column="2"

Margin="8,0,0,0"

VerticalOptions="Center"

Text="{Binding Item.DisplayName}" />

</Grid>

<Grid x:Name="AutoCompleteGrid" Margin="{Binding Path=Level, Converter={StaticResource LevelToMarginConverter}}"

IsVisible="{Binding Item.ShowAutoComplete}">

<input:RadAutoCompleteView x:Name="TopicsAutoCompleteView"

Text="{Binding Item.SearchText, Mode=TwoWay}"

ItemsSource="{Binding Item.Items}"

Watermark="Search here..."

DisplayMode="Tokens"

IsClearButtonVisible="True"

CompletionMode="StartsWith"

Tokens="{Binding Item.SelectedItems, Mode=TwoWay}"

SuggestionItemSelected="RadAutoCompleteView_OnSuggestionItemSelected"

TextSearchPath="PortfolioTransactionCustomValue"

SearchThreshold="1"/>

</Grid>

</DataTemplate>

</telerikDataControls:TreeViewDescriptor.ItemTemplate>

</telerikDataControls:TreeViewDescriptor>

</telerikDataControls:RadTreeView>

TreeView

answered on 08 Jan 2020

1 answer

94 views

Recognition error after reinstalling

Hi..

I'm getting an error can't find 'Telerik' namespace.. This happened after formatting my PC and reinstalling Telerik Xamarin UI.

Help me, please.

General Discussions

answered on 08 Jan 2020

2 answers

134 views

Header text changed alone

Hello I think there`s a bug.

When the DataGrid width is bigger than screen , column header text is changed after been invisible.

Look in this video at the right last column

DataGrid

answered on 06 Jan 2020

1 answer

207 views

tab icon above header text

I need to add icon above tab text how to do that in xaml ?

TabView

answered on 06 Jan 2020

2 answers

416 views

Get PdfViewer current page

Hello. I'm trying to implement a control for displaying Terms and Conditions on my app using PDFViewer. I want to have an "accept" button below the viewer that Will become enabled when the user has scrolled to the bottom of the PDF (and hopefully read the document).

For this I would like to know the page number the user is currently Reading, and perhaps also an event that fires when it changes. Is this available in the PDFViewer control? I found references to VerticalScrollState, but that seems to only be available for Windows (is that right?)

What would be the correct approach to get this behavior on Xamarin Forms? Thank you

PdfViewer

answered on 03 Jan 2020

1 answer

124 views

RadDataForm basic usage issues

I'm attempting to add a RadDataForm to a fragment:

this.form = new RadDataForm(this.Context);

var entity = new Models.Inventory.ConveyanceReceipt();

this.form.SetEntity(entity);

this._root.AddView(this.form);

The line where i call .SetEntity(object) throws a Java.Lang null pointer exception:

Unhandled Exception:

Java.Lang.NullPointerException: Attempt to invoke virtual method 'boolean java.lang.Class.isInterface()' on a null object reference.

The entity model is:

public class ConveyanceReceipt : Java.Lang.Object

{

[DataFormProperty(Label="Conveyance ID", Index = 1, Required = true)]

public string Tracker { get; set; }

[DataFormProperty(Label = "Scan Time", Index = 0, ReadOnly = true)]

public DateTime Time { get; set; } = DateTime.Now;

}

I kept it very simple and I really am trying to wrap my head around why I can't get the basic example past SetEntity();

Any help would be greatly appreciated, is there some initialization that I'm not doing? I tried tracking down the isInterface getter and couldn't locate a value for it in debugger.

DataForm - Xamarin.Android