This is a migrated thread and some comments may be shown as answers.

Align CheckBoxs elements to the right

4 Answers 475 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Hernando
Top achievements
Rank 1
Iron
Hernando asked on 04 Apr 2019, 01:16 PM

Hi, 

is it possible to align the checkboxes to the right off the screen. At the moment is proven difficult for some user with big finger to tap the checkbox and they end up collapsing the item. 

Thank you.

Hernando .

4 Answers, 1 is accepted

Sort by
0
Lance | Manager Technical Support
Telerik team
answered on 04 Apr 2019, 06:27 PM
Hello Hernando,

You can align any Xamarin.Forms View element by setting the HorizontalOptions property to End.

<telerikPrimitives:RadCheckBox HorizontalOptions="End"/>

If you're having implementation specific problems, open a Support Ticket and provide all of the code for that page so that we can work on a directly solution for you.

Regards,
Lance | Technical Support Engineer, Principal
Progress 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
0
Hernando
Top achievements
Rank 1
Iron
answered on 05 Apr 2019, 07:38 AM

Hi , I meant the CheckBoxes on the TreeView Control , CheckBoxMode="Individual", can these be align to the left ?

<telerikDataControls:RadTreeView x:Name="treeView" ItemsSource="{Binding GeometricLocations}"
                                 CheckBoxMode="Individual" AbsoluteLayout.LayoutBounds="0, 0">

 

Thanks

0
Accepted
Lance | Manager Technical Support
Telerik team
answered on 05 Apr 2019, 03:21 PM
Hello Hernando,

At this time, there is no positioning property available for the check boxes. Therefore, I have created a Feature Request on your behalf, you can find it in the Feedback Portal here: TreeView - CheckBox Alignment


Solution

In the meantime, you do have control over the appearance of the entire item's content if you define an ItemTemplate. For your convenience, I've pasted in the default ItemTemplate used by the TreeView below.

Prerequisite

Before getting started customizing with that ItemTemplate, I recommend visiting and reviewing this demo. To understand how to set the ItemTemplate property of the TreeView.

Customizing

Once you're familiar with the initial setup, you can rearrange the default ItemTemplate below to fit your needs. I've left a couple comments to help you get started.

Please keep in mind that you do not want to remove any of he existing value bindings as this is expected to be in place from the TreeView's internal logic. You can add things, just avoid removing things.

<DataTemplate x:Key="MyTreeViewItemTemplate">
    <StackLayout Orientation="Horizontal"
        HeightRequest="40"
        Margin="{Binding Path=Level, Converter={StaticResource levelToMarginConverter}}">
                 
        <!-- This is the Expand/Collapse indicator-->
        <treeView: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}">
            <AutomationProperties.HelpText>
                <OnPlatform x:TypeArguments="x:String">
                    <On Platform="iOS" Value="RadTreeView"></On>
                </OnPlatform>
            </AutomationProperties.HelpText>
        </treeView:ExpandCollapseIndicator>
                 
        <!-- This is the checkbox, you can move this to the right of the ItemText element-->
        <primitives:RadCheckBox IsChecked="{Binding Path=IsChecked, Mode=TwoWay}"
                    IsVisible="{Binding Path=IsCheckBoxVisible}"
                    VerticalOptions="Center">
            <AutomationProperties.HelpText>
                <OnPlatform x:TypeArguments="x:String">
                    <On Platform="iOS" Value="RadTreeView"></On>
                </OnPlatform>
            </AutomationProperties.HelpText>
        </primitives:RadCheckBox>
        <treeView:ItemText Text="{Binding Path=Header}"
            VerticalTextAlignment="Center">
            <AutomationProperties.HelpText>
                <OnPlatform x:TypeArguments="x:String">
                    <On Platform="iOS" Value="RadTreeView"></On>
                </OnPlatform>
            </AutomationProperties.HelpText>
        </treeView:ItemText>
                 
        <!-- You could try moving the Checkbox here. This will be to thr right of the text-->
    </StackLayout>
</DataTemplate>

the above example uses the following namespaces:

xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:treeView="clr-namespace:Telerik.XamarinForms.DataControls.TreeView;assembly=Telerik.XamarinForms.DataControls"
xmlns:primitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"

and the following converter needs to be defined:

<treeView:LevelToMarginConverter x:Key="levelToMarginConverter"/>


Further Assistance

I hope this helps you get the final result you're looking for. If you do have trouble, please open a Support Ticket here and share all the code you're using. By sharing the code and describing what the problem is, the engineering team will able to assist further.

Regards,
Lance | Technical Support Engineer, Principal
Progress 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
0
Hernando
Top achievements
Rank 1
Iron
answered on 09 Apr 2019, 10:11 AM
this is good thanks .
Tags
TreeView
Asked by
Hernando
Top achievements
Rank 1
Iron
Answers by
Lance | Manager Technical Support
Telerik team
Hernando
Top achievements
Rank 1
Iron
Share this question
or