We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Float header and footer next buttons

Thread ID:

Created:

Updated:

Platform:

Replies:

145608 Jul 1,2019 07:18 AM UTC Jul 3,2019 10:13 AM UTC Xamarin.Forms 7
loading
Tags: SfListView
Mark
Asked On July 1, 2019 07:20 AM UTC

Hi,

I am using a rotator which interacts with a list view for navigation. I hide and show the navigation buttons depending on if you are at the start or end of the list.

Start of list:

Middle of list:

End of list:

I wish to float the navigation buttons so that I don't have this gap:

I will make the buttons transparent so only the icon is visible with the square visible underneath.

Here is a example from the Windows store:

Button is visible and sits on top of content:

Disappears if at the end of the list and don't have the gap.

Attached is my Xaml code.

Thanks

Mark.








Attachment: Rotator_and_ListView_c10b956e.zip

Dinesh Babu Yadav [Syncfusion]
Replied On July 2, 2019 07:23 AM UTC

Hi Mark, 
 
Thank you for contacting Syncfusion support. 
 
Based on your requirement, we have prepared the sample by arranging the grid elements in the XAML page with SfListView control. Please find the sample from the below link. 
 
 
Please let us know if you require further assistance. 
 
Regards, 
Dinesh Babu Yadav 


Mark
Replied On July 2, 2019 09:59 AM UTC

Hi,

Thank you for this. It looks very promising.

One last request if possible:

I tried to make it transparent so the red shows through (I made the listview background red). Is there an easy way to achieve this?

xx
Thanks

Mark.

Dinesh Babu Yadav [Syncfusion]
Replied On July 2, 2019 12:58 PM UTC

Hi Mark, 
 
Thanks for the update. 
 
In the last update, we have used the Image for Left and Right arrows so, transparent color doesn’t work on the Image. To overcome from this problem, we suggest you to use the custom fonts which has similar view like left and right arrows. Please refer the following UG documentation link for more reference about working with custom fonts in Xamarin.Forms. 
 
Working with Fonts in Xamarin Forms: https://xamarinhelp.com/custom-fonts-xamarin-forms/  
 
For your reference, we have modified the sample based on your requirement with custom fonts and you can download it from the below link. 
 
 
Please let us know if you require further assistance. 
 
Regards, 
Dinesh Babu Yadav 


Mark
Replied On July 2, 2019 02:02 PM UTC

Hi,

I tried your sample and it is not working as expected. The problems I found were:

1. The arrows would not step one by one but go directly to the beginning or end.
2. I had to add an index property to ListViewBookInfo and then changed the code to this:

You can not see the image and purple in the below screenshot.


This is what we have (the text is cut off by the arrow so is not transparent):

This is what we are aiming for (created in a image editor)

The arrow background is truly transparent.

Attached is the modified project.

Thanks

Mark.






Attachment: ListViewsample_5c8f974d.zip

Dinesh Babu Yadav [Syncfusion]
Replied On July 3, 2019 09:23 AM UTC

Hi Mark, 
 
Sorry for the inconvenience caused. 
 
Based on your requirement “Transparent arrow icon with SfListView”, we have modified the sample and you can download it from the below link. 
 
 
Please let us know if you require further assistance. 
 
Regards, 
Dinesh Babu Yadav 


Mark
Replied On July 3, 2019 10:06 AM UTC

Hi Dinesh,

Thank you for this. This is awesome and working very well.

Thanks for all of your help.

Mark.

Dinesh Babu Yadav [Syncfusion]
Replied On July 3, 2019 10:13 AM UTC

Hi Mark, 
 
Thanks for the update. Please get back to us if you require further assistance. 
 
Regards, 
Dinesh Babu Yadav  


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon