Setting OpenIcon & CloseIcon from Code Behind to a non image file

[Matthew Bailey]

Hello,

I'm wondering if the CloseIcon and OpenIcon can be bound to a unicode value somehow in the code behind?

I'm converting my app to incorporate Syncfusion, and I have a page using BackdropPage, but I'd like to customize the icons without forcing a local or embedded image. I have other places in my app where I declare an image based on the glyph unicode from a font I loaded. I do that with FontImageSource within the Image.Source reference in XAML
<Image>
    <Image.Source>
         <FontImageSource/>
    </Image.Source>
</Image>

Can I manipulate these resources in SfBackdropPage in a similar way?

[Rachel A]

Hi Matthew, 

 

Greetings from Syncfusion. 

 

You can place the FontImageSource in the place of Open and Close icon of the SfBackdrop page. We have achieved this requirement using the toolbar item clicked event. Please find the below code snippet and sample for your reference. 

 

[C#] 

 

public MainPage()
{
            InitializeComponent();

            ToolbarItems[0].Clicked += Handle_Clicked;
}

void Handle_Clicked(object sender, EventArgs e)
{
            FontImageSource fontImageSource = new FontImageSource();

            fontImageSource.FontFamily = Device.RuntimePlatform == Device.Android ? "UIFontIcons.ttf#UIFontIcons" : Device.RuntimePlatform == Device.iOS ? "UIFontIcons" : "Assets/UIFontIcons.ttf#UIFontIcons";
            fontImageSource.Color = Color.Red;

            if (((sender as ToolbarItem).Parent as SfBackdropPage).IsBackLayerRevealed)
            {
                fontImageSource.Glyph = "\ue72d";
            }
            else
            {
                fontImageSource.Glyph = "\ue709";
            }

            (sender as ToolbarItem).IconImageSource = fontImageSource;
} 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Backdrop_FontImageIcon584307936 

 

Please follow the below procedure to add font file for each platform. 

 

Link: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/text/fonts#display-font-icons 

 

Please let us know if you need further assistance on this. 

 

Regards, 

Rachel.