Telerik Forums
UI for Xamarin Forum
1 answer
97 views

I want to make Command when tapped on item in tree view but this stopped Collapse / Expand behavior on tree View

 

Any help ?

Thanks.

Didi
Telerik team
 answered on 09 Dec 2021
0 answers
68 views

I use RadTreeView when i change flow direction To Right to left in Arabic language the treeView Display in one level 

like in attached image .

Any help ?

 

Menna
Top achievements
Rank 1
 updated question on 08 Dec 2021
1 answer
61 views

I am not able to set ItemEdit template in the treeview!

My template name is : CarEditTemplates

Basically what is the values to be set in the Dispalymemeberpath="" & ITemSourcePath=""?

 <StackLayout Grid.Row="1" BackgroundColor="White" Margin="5">
                  <telerikDataControls:RadTreeView  x:Name="treeView" ItemsSource="{Binding MobileEditTemplates}">
                       <telerikDataControls:TreeViewDescriptor DisplayMemberPath="{Binding Name}" ItemsSourcePath=" " TargetType="{x:Type local:MobileEditTemplates}">
                            <telerikDataControls:TreeViewDescriptor.ItemTemplate>
                                <DataTemplate>
                                    <Grid Margin="2">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="20" />
                                            <ColumnDefinition Width="*" />
                                        </Grid.ColumnDefinitions>
                                        <telerikTreeView:ExpandCollapseIndicator FontSize="Medium" WidthRequest="10" Margin="15,0" VerticalTextAlignment="Center" />  
                                        <telerikTreeView:ItemText Grid.Column="1" FontAttributes="Bold" FontSize="Small" Text="{Binding Name}" TextColor="Gray" VerticalTextAlignment="Center"/>
                                    </Grid>
                                 </DataTemplate>
                            </telerikDataControls:TreeViewDescriptor.ItemTemplate>
                    </telerikDataControls:TreeViewDescriptor>
                    <telerikDataControls:TreeViewDescriptor DisplayMemberPath="Name"
                                            TargetType="{x:Type local:SymbolItem}" />
</telerikDataControls:RadTreeView>
                </StackLayout>

Yana
Telerik team
 answered on 10 Nov 2020
5 answers
224 views

Hi, can't find anything on how to style tree view items.

Specifically I'm trying to control the indent of child items and shrink the whitespace around items. (and the gap between the expand arrow on the text)

Didi
Telerik team
 answered on 09 Oct 2020
2 answers
62 views

Hi there, it's me again :)

 

Is it possible to focus an item of the tree ? I'm using the tree to select a value, that is saved. When I create the tree, I want to focus this value, previously defined. But I can't find any way to expand the tree to this item, and focus on it. I already have a customization to highlight this item, but it's not in the screen when the initialization is done, so I can't see that I already have a selected value (unless I scroll the whole tree to check it myself) :(

The ItemSource of the TreeView is a ObservableCollection<CustomObject> and I know exactly wich CustomObject I would like to focus.

Thank you :)

Bra
Top achievements
Rank 1
Veteran
 answered on 28 Sep 2020
2 answers
74 views

Hello,

I would like to filter a TreeView, but I can't find any solution for Xamarin.Forms. Is it possible or not ?

Thank you :)

Bra
Top achievements
Rank 1
Veteran
 answered on 09 Sep 2020
2 answers
1.5K+ 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>
Jacob
Top achievements
Rank 1
 answered on 14 Jan 2020
6 answers
192 views

[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/>
                        <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>
                </Grid>
            </DataTemplate>
        </telerikDataControls:TreeViewDescriptor.ItemTemplate>
    </telerikDataControls:TreeViewDescriptor>
</telerikDataControls:RadTreeView>

Lance | Manager Technical Support
Telerik team
 answered on 08 Jan 2020
5 answers
179 views

I'm trying to do some very simple proof-of-concept stuff in Xamarin with the Telerik TreeView and I'm experiencing cutoff expanders that are fine when non-expanded but the right side is cut off when expanded (see attachment). What might I need to do to have it display correctly?

The code is pretty simple: 

 <telerikDataControls:RadTreeView Grid.Column="0" x:Name="TopicsTreeView" ItemsSource="{Binding Topics}" CheckBoxMode="Propagate">
        <telerikDataControls:TreeViewDescriptor ItemsSourcePath="Items" DisplayMemberPath="DisplayName" TargetType="{x:Type v1:Topic}"/>
 </telerikDataControls:RadTreeView>

Thanks.

Bruce
Top achievements
Rank 2
 answered on 09 Dec 2019
1 answer
94 views

I have the following:

<telerikDataControls:TreeViewDescriptor
        DisplayMemberPath="Title"
        ItemsSourcePath="Children"
        TargetType="{x:Type viewHelpers:GroupSettingsModel}">
    <telerikDataControls:TreeViewDescriptor.ItemTemplate>
        <DataTemplate>
            <Grid Margin="{Binding Path=Level, Converter={StaticResource levelToMarginConverter}}"
                    HeightRequest="40"
                    ColumnSpacing="0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto"/>
                </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}" />
            <!--HOW TO ADD CHECKBOX HERE?-->
            <telerikTreeView:ItemText
                Grid.Column="2"
                Margin="8,0,0,0"
                VerticalOptions="Center"
                Text="{Binding Item.Title}" />
                
            </Grid>
        </DataTemplate>
    </telerikDataControls:TreeViewDescriptor.ItemTemplate>
</telerikDataControls:TreeViewDescriptor>

 

Can you tell me how to add back the checkbox to my custom Template?

Didi
Telerik team
 answered on 05 Dec 2019
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Iron
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?