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

How to change position of slide buttons?

3 Answers 61 Views
This is a migrated thread and some comments may be shown as answers.
Bill
Top achievements
Rank 1
Bill asked on 12 Dec 2017, 03:34 PM
I'd like to be able to move the slide buttons from the middle of the control to the bottom. How is this achieved?

3 Answers, 1 is accepted

Sort by
0
Accepted
Nikolay Demirev
Telerik team
answered on 14 Dec 2017, 04:30 PM
Hello Bill,

You can customize the buttons and indicators by modifying the control template. Here is the original template of the SlideView:
<ControlTemplate x:Key="RadSlideView_ControlTemplate">
        <Grid>
            <ContentPresenter />
 
                <Grid HorizontalOptions="Start" VerticalOptions="Center" IsVisible="{TemplateBinding ShowButtons}">
                    <Label Text="‹" FontSize="{TemplateBinding SlideButtonsSize}" FontFamily="Arial" HorizontalOptions="Start" TextColor="{TemplateBinding SlideButtonsColor}" />
                    <Button Command="{TemplateBinding Path=PreviousItemCommand}" BackgroundColor="Transparent"  InputTransparent="False">
                        <Button.Opacity>
                            <OnPlatform x:TypeArguments="x:Double"
                                    iOS="1"
                                    Android="0"
                                    WinPhone="0"/>
                        </Button.Opacity>
                    </Button>
                </Grid>
 
                <Grid VerticalOptions="Center" HorizontalOptions="End" IsVisible="{TemplateBinding ShowButtons}">
                    <Label Text="›" FontSize="{TemplateBinding SlideButtonsSize}" FontFamily="Arial" HorizontalOptions="End" TextColor="{TemplateBinding SlideButtonsColor}"/>
                    <Button Command="{TemplateBinding Path=NextItemCommand}" BackgroundColor="Transparent"  InputTransparent="False">
                        <Button.Opacity>
                            <OnPlatform x:TypeArguments="x:Double"
                                    iOS="1"
                                    Android="0"
                                    WinPhone="0"/>
                        </Button.Opacity>
                    </Button>
                </Grid>
 
                <slideView:SlideViewIndicators Owner="{TemplateBinding}" Spacing="{TemplateBinding Path=IndicatorsSpacing}"
                    SelectedIndicatorTemplate="{TemplateBinding SelectedIndicatorTemplate}" IndicatorTemplate="{TemplateBinding IndicatorTemplate}"
                    IsVisible="{TemplateBinding ShowIndicators}" VerticalOptions="End" HorizontalOptions="Center" InputTransparent="True"/>
        </Grid>
    </ControlTemplate>

Just modify it and set it to the ControlTemplate property of the SlideView.

I hope this helps.

Regards,
Nikolay Demirev
Progress TelerikSlideView for Xamarin
0
Bill
Top achievements
Rank 1
answered on 15 Dec 2017, 10:32 AM

Thanks, I managed to get that working. One small thing though, I had to remove this:

<Button.Opacity>
  <OnPlatform x:TypeArguments="x:Double" iOS="1" Android="0" WinPhone="0"/>
</Button.Opacity>

 

As it was causing the following error:

"Unable to cast object of type 'Xamarin.Forms.Xaml.ListNode' to type 'Xamarin.Forms.Xaml.IElementNode'."

 

 

 

 

0
Accepted
Nikolay Demirev
Telerik team
answered on 15 Dec 2017, 12:25 PM
Hello Bill,

I am glad you have managed to get it working.

is currently obsolete, and if you use a newer version of Xamarin.Forms it might be an issue. You could update it to use the new syntax:
<OnPlatform x:TypeArguments="x:Double">
    <On Platform="iOS">1</On>
    <On Platform="Android, UWP">0</On>
</OnPlatform>

I am not sure that that will solve the issue because I can not reproduce it, but it might be a solution.

Regards,
Nikolay Demirev
Progress TelerikSlideView for Xamarin
Asked by
Bill
Top achievements
Rank 1
Answers by
Nikolay Demirev
Telerik team
Bill
Top achievements
Rank 1
Share this question
or