jsmarcus / iconize Goto Github PK
View Code? Open in Web Editor NEWUse icon fonts in your Xamarin.Forms application!
License: Other
Use icon fonts in your Xamarin.Forms application!
License: Other
Hi,
Is it possible to create an Icon on c# side vs XAML?
Thanks!!
Hector
PS. Great job creating this Plugin! thanks!
I did some debugging on UWP and noticed that the renderer throws exceptions in a couple of places. I propose that you update the code as shown below:
/// <summary>
/// Called when [update toolbar items].
private async void UpdateToolbarItems()
{
// add this null check
if (Element?.Platform == null)
return;
var platform = Element.Platform;
FieldInfo fInfo = typeof(Platform).GetField("_container", BindingFlags.NonPublic | BindingFlags.Instance);
Canvas canvas = fInfo.GetValue(platform) as Canvas;
if (canvas?.Children?[0] is MasterDetailControl masterDetailControl)
{
var mInfo = typeof(MasterDetailControl).GetTypeInfo().GetDeclaredMethod("Xamarin.Forms.Platform.UWP.IToolbarProvider.GetCommandBarAsync");
var commandBar = await (mInfo.Invoke(masterDetailControl, new Object[] { }) as Task<CommandBar>);
commandBar.UpdateToolbarItems();
}
}
/// <summary>
/// Called when [update toolbar items].
/// </summary>
/// <param name="sender">The sender.</param>
private async void OnUpdateToolbarItems(Object sender)
{
// a workaround for MasterDetailPage
if (Element?.Parent is MasterDetailPage ms) // add this null check
{
ms.IsPresentedChanged += (s, e) =>
{
UpdateToolbarItems();
};
UpdateToolbarItems();
}
var method = typeof(NavigationPageRenderer).GetTypeInfo().GetDeclaredMethod("Xamarin.Forms.Platform.UWP.IToolbarProvider.GetCommandBarAsync");
var bar = await (method.Invoke(this, new Object[] { }) as Task<CommandBar>);
bar.UpdateToolbarItems();
}
Fontawesome font is not rendering in android only iOS. What may be happening or missing?
Hello,
I would like to know if there is a way to create a button containing both a label ("Add to cart") and the related icon ("Cart")?
Something that looks like this.
Of course, I would like to use a FontIcon as icon...
Thank you!
The Icons aren't showing up at all when I use a IconNavigationPage inside a MasterDetailPage
To reproduce:
MainPage = new MasterDetailPage()
{
Master = new ContentPage() { Title = "master" },
Detail = new IconNavigationPage(new Page1() { Title = "detail" })
};
Hello, I have recently started writing a multi-platform mobile app using Xamarin Forms and the Prism library (v7.x). I found Iconize and have it working in a simple Prism app, but so far only for labels and buttons. In regards to using toolbar buttons, from what I have read in some other posts, the 'detail' page(s) must be wrapped in IconNavigationPage. Prism of course has its own way of 'doing' navigation and seems to wrap the pages in the standard NavigationPage, which, I assume results in some amount (all?) of the Iconize code to be skipped. The toolbar 'button' is there, but no icon or text displays.
Does anyone know of a way to get Iconize to work with Prism generated master-detail page toolbars?
Thanks,
-David
When using the "Plugin.Iconize.WeatherIcons.iOS" package, the following warning is displayed at runtime:
* CoreText performance note: Client called CTFontCreateWithName() using name "Weather Icons" and got font with PostScript name "WeatherIcons-Regular". For best performance, only use PostScript names when calling this API.
Remark: This could be fixed by specifying the correct Font-name "WeatherIcons-Regular
" in the constructor:
public WeatherIconsModule() : base("Weather Icons", "WeatherIcons-Regular", "iconize-weathericons.ttf", WeatherIconsCollection.Icons)
{
// Intentionally left blank
}
Thank you for a great library.
Is it possible to get an image of the icon to use as a property of ImageSource??
I'm new to Iconize as of tonight. I found the following issues and they have thrown me off. I hesitate to continue experimenting with this library.
There is another repo under "jsmarcus" that could be the right spot to look (but this one is). Recommendation: Edit the readme on the other one to say "This is deprecated" in big letters and point users to the right repo (this one).
The ReadMe in this repo has code snippets that are invalid when you pull down the Nuget package,
but they do work in the samples. Can you please clarify? One idea is to build a separate repo/sample that only uses the published Nuget package (or at least do that as a unit test for yourself)
Example (how does one initialize the lib?):
// Is it the one in the Readme?
Plugin.Iconize.Droid.IconControls.Init(Resource.Id.toolbar, Resource.Id.tabs);
// Or Is it the one in the Droid sample?
Plugin.Iconize.Iconize.Init(Resource.Id.toolbar, Resource.Id.tabs);
// Answer: I don't know because neither one works (but they work in the sample)
I don't know if this suggestion go out of main objective of this plugin, but, nowadays it more useful the use of icon as SVG file, for several reasons, so, not would be interesting enable this usage? maybe add this feature to the current project, or create a isolated version that works only with SVG? I'm was thinking about this, and analayzing alternatives that can cover this scenario, and this suggestion above can be one of this alternatives. Thanks
Hello,
The next stable release was over a year ago now - are there any plans to release a new stable version soon?
Thank you :)
Hello,
on an iPhone7 IOS 10.3 simulator the ios sample app only shows a questionmark icon or the name of the icon instead of the real icon.
IconToolBarItem shows questionmark
IconImage shows questionmark
IconImage shows questionmark
IconButton shows name
IconLabel shows name
The same on a real device.
All nuget packages are the latest version as of today.
Currently support for macOS by Xamarin is in beta with version 2.3.5. Would it be possible to provide a pre-release with macOS support?
I have attached an example: a MasterDetailPage with an IconNavigationPage. There we can find an IconToolbarItem with a car icon.
Please click on "Navigate" and quickly navigate back by means of the "back button". The IconToolbarItem disapears until we restart the app.
Is there any solution for that problem?
Thank you and best regards,
David
Hello,
I try to create a Rounded/Circle Button that can use font icons: so I tried to use the existing IconButton
.
I first tried this, by fixing BorderRadius
as the half value of the HeightRequest
/WidthRequest
:
<iconize:IconButton HeightRequest="40" WidthRequest="40"
BorderRadius="20"
Text="fa-500px" TextColor="Red" FontSize="20"
BackgroundColor="Orange" BorderColor="Red"
BorderWidth="2"
VerticalOptions="Start" HorizontalOptions="Center">
</iconize:IconButton>
The default rendering works as expected on UWP, but the "clicked" rendering is not good, as a rectangle is appearing.
However on Android, the button is always in "default" mode: there is no border, no background, ...
So I've added a FlatButton control, and a Renderer for Android:
public class FlatButton : IconButton
{
}
[assembly: ExportRenderer(typeof(FlatButton), typeof(FlatButtonRenderer))]
namespace Iconize.Sample.Droid.Renderers
{
public class FlatButtonRenderer : ButtonRenderer
{
protected override void OnDraw(Android.Graphics.Canvas canvas)
{
base.OnDraw(canvas);
}
protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
{
base.OnElementChanged(e);
}
}
}
And I use it like this:
<controls:FlatButton HeightRequest="40" WidthRequest="40"
BorderRadius="20"
Text="fa-500px" TextColor="Red" FontSize="20"
BackgroundColor="Orange" BorderColor="Red"
BorderWidth="2"
VerticalOptions="Start" HorizontalOptions="Center">
</controls:FlatButton>
This time, the rounded rendering is fine on Android, but I've lost the "display" of the font icon.
Here is a screenshot.
Is there a way to keep the rounded renderer and the icon display?
And in a second time, is there a way to fix the rendering issue on UWP when the button is clicked?
I ran into a super weird issue here. Look at the two labels below:
<Grid x:Name="LayoutRoot">
<!-- outer circle -->
<iconize:IconLabel TextColor="{Binding CircleColor}"
FontSize="{Binding ButtonSize, Converter={StaticResource CircleButtonSizeConverter}}"
Text="fa-circle"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
<!-- inner icon -->
<iconize:IconLabel TextColor="White"
FontSize="{Binding ButtonSize, Converter={StaticResource CircleButtonIconSizeConverter}}"
Text="fa-facebook"
HorizontalOptions="Center"
VerticalOptions="Center"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
</Grid>
The first of those labels renders the icon correctly. The seconds doesn't, but shows the text of the assigned icon instead ("fa-facebook").
I think the main bug here is that the FontSize is being set dynamically, which resets the font lookup. If I set it to a fixed value (e.g. 32), Both icons render fine.
This of course left me with a bit of a WTF as to why one worked and one didn't. After trimming the fat of the control, I was left with the above two labels that have one major difference: One has the TextColor assigned through a binding (which causes the icon to render), one has a hardcoded TextColor, which causes the Label to screw up. Again, those are probably just follow-up issues of the FontSize bug.
This is XF 2.3.3 pre1 on iOS with Iconize 1.0.1.0
Thanks,
Philipp
icons are not showing for ionicons using text such as "ion-ios-plus-empty", did something change with the naming convention?
I'm trying to implement iconize in a new project. I've followed all the requirements listed on the readme, but I have still this error when the application starts on Android:
System.TypeLoadException: Could not load type Plugin.Iconize.IconButtonRenderer while decoding custom attribute: (null)
Any idea?
Hi,
I am using current stable 1.0.10 since months. I wanted to upgrade my project to NetStandard. Does Iconize support NetStandard?
Can't install Fonts on PCL, targeting wrong version.
#1 implies that I only need to install fonts in Droid/iOS projects.
PCL instructions implies that Fonts need to be installed on PCL and initialized using
With(new Iconize.Fonts.FontAwesome())
There's also an additional package available, Xam.FormsPlugin.Iconize
linked back to this repo.
Question - how to properly setup for PCL use? Sorry if I missed something.
IconToolbarItem only support AppCompat project,please indicate it in Readme.
Need to replace NavigationPage with IconNavigationPage,or nothing will appear.
I ran into it and read the source code to figure it out.
I'm attempting to add Xam.Plugin.Inconize.Material package via nuget to a Xamarin Forms netstandard2.0 project and receive the following:
ERROR: Package Xam.Plugin.Iconize.Material 1.0.10 is not compatible with netstandard2.0 (.NETStandard,Version=v2.0). Package Xam.Plugin.Iconize.Material 1.0.10 supports:
on src the font awesome "fa-user-circle-o" is listed but on the nuget library it was not included
hi,
i have been using your awesome library for my xamaring forms app for quite sometimes andi am very happy with what you have done with it, but now my next project i am building in is completely based on native patterns (starting with droid). but i cannot find a droid specific sample in your repo.
can you help me kick starting with android specific setup, what i need to do to get the library working with native toolbar and bottom navigation bar which i am using from here https://github.com/pocheshire/BottomNavigationBar
regards
Since the documentation is lacking in steps to get this library working in a shared project, is it safe to assume there is no support for SAP
s? I'm a newbie here, and I just can't seem to get this library to work in my shared project.
If requested, I can share some of my set up and code base.
Thanks in advance! ❤️
Hi , Thank you for the great lib . It's really handy .
Secondly , Is there anyway I can assign your Icontoolbar item to the left side 'the easy way' ?
Hello,
I've downloaded the sources from jsmarcus/Iconize and I've built the samples.
But I encounter a problem on iOS: the fonts don't seem to work.
Screenshot iOS
On Android, there is no problem:
Screenshot Android
I've also seen that only the the PCL project seems to contain NuGets packages: how is it possible?
having issue with toolbar icons crashing app with this error message
unable to convert instance of type 'Android.Support.V7.View.Menu.ActionMenuItemView' to type 'Android.Support.V7.Widget.Toolbar'
I have a ListView
binded to a list of MenuItem
public class MenuItem
{
public string Icon { get; set; }
public string Title { get; set; }
public string Page { get; set; }
}
public ObservableCollection<BeloteMenuItem> _menuItems = new ObservableCollection<BeloteMenuItem>(
new[]
{
new BeloteMenuItem { Icon = "fa-home" },
new BeloteMenuItem { Icon = null }
});
<ListView x:Name="MenuItemsListView"
SeparatorVisibility="None"
HasUnevenRows="true"
ItemsSource="{Binding MenuItems}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Padding="15,10" HorizontalOptions="FillAndExpand">
<iconize:IconImage HeightRequest="20" Icon="{Binding Icon}" IconColor="Black" WidthRequest="20" />
<Label VerticalOptions="FillAndExpand"
VerticalTextAlignment="Center"
Text="{Binding Title}"
FontSize="17"/>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
In my example I volontary set one of my icon
to null and the app immediately crashes, an the Xamarin.Forms error is not very convenient to debug.
I working on Visual Studio 2015, Update 3. I create a basic app using the Xamarin.Forms XAML template. Then in the PCL project, using NuGet, I add a reference to FormsPlugin.Iconize. This works fine. But when I try to add a reference to any of the font libraries, such as Iconize.FontAwesome, I get the message shown below. I have tried this with all the fonts, and I get the same message.
Could not install package 'Xam.Plugin.Iconize.FontAwesome 1.5.0.2-beta'. You are trying to install this package into a project that targets '.NETPortable,Version=v4.5,Profile=Profile259', but the package does not contain any assembly references or content files that are compatible with that framework. For more information, contact the package author.
Hi,
What's the correct way to do this?
I've tried the following but keep getting a square with a question mark in it:
new IconLabel{ FontSize = 20, Text="\uf164", FontFamily = "FontAwesome" }
new IconLabel{ FontSize = 20, Text="fa-thumbs-up", FontFamily = "FontAwesome" }
new IconLabel{ FontSize = 20, Text="\uf164" }
new IconLabel{ FontSize = 20, Text="fa-thumbs-up" }
I'm working on a xamarin forms project and have installed the latest beta versions of:
How do you set the icon on the icon button? I don't see any override methods on the IconButton class.
Thanks
FYI in case you're not aware. Created a vanilla Forms app and referenced the latest pre-Version of Iconize, which crashed during startup. Setting the version back to the latest stable rectified the issue.
Thanks,
Philipp
Hello,
The TabbedPage already works with Iconize. But in the next release of Xamarin.Forms, it will be possible to display the TabbedPage as a Bottom Navigation view on Android.
It would so be interesting if we could use Font icons for this specific case.
Have you already investigate on this possibility?
Regards,
I've installed these plugins in my Xamarin Forms solution (in all projects):
Xam.FormsPlugin.Iconize (1.5.0.13-beta)
Xam.Plugin.Iconize (2.0.0.29-beta)
Xam.Plugin.Iconize.FontAwesome (2.0.0.29-beta)
When I try to run the application after setting up the font and its usages in XAML files, I get this error:
Exception while loading assemblies: System.IO.FileNotFoundException: Could not load assembly 'Plugin.Iconize.Droid, Version=1.5.0.13, Culture=neutral, PublicKeyToken='. Perhaps it doesn't exist in the Mono for Android profile?
File name: 'Plugin.Iconize.Droid.dll'
at Java.Interop.Tools.Cecil.DirectoryAssemblyResolver.Resolve(AssemblyNameReference reference, ReaderParameters parameters)
at Xamarin.Android.Tasks.ResolveAssemblies.AddAssemblyReferences(DirectoryAssemblyResolver resolver, ICollection`1 assemblies, AssemblyDefinition assembly, Boolean topLevel)
at Xamarin.Android.Tasks.ResolveAssemblies.Execute(DirectoryAssemblyResolver resolver)
I'm new to Xamarin Forms and I have no idea why is this issue occurring. Any help will be greatly appreciated.
It appears that Iconize is not compatible with .NET Standard 2.0. I have not been able to include the Xam... assemblies without errors.
I've have been able to add the Xam assemblies to my .net standard 2.0 solution by downgrade Xamarin Forms to 2.4.0.91020. It still does not work, however; the icons do not display.
Please inform when Iconize will be compatible with the latest Xamarin forms and .NET Standard 2.0.
IconToolbarItem does not work with Xamarin.Forms on UWP
In commit history I found that FontAweSome was updated to 4.7.0 on Nov 2: e89000e
How can I use this already? I have installed the latest prelease (1.5.0.8-beta) in my projects, but still the old FontAwesome 4.6.3 is in there...
Assuming it's not something I am doing wrong, the Iconize controls are not visible in the Xamarin (Visual Studio Mac) Preview panel.
Looks like there's a problem with the last Iconize version.
Unhandled Exception:
System.MethodAccessException: Method `Plugin.Iconize.IconImageRenderer:.ctor ()' is inaccessible from method `Xamarin.Forms.Platform.Android.FastRenderers.ImageRenderer:.ctor ()'
Tested with a new project and Xamarin.Forms => 2.3.5.233.
Anyone else with the same problem ?
EDIT: The problem occurred after updating all Xamarin.Android.Support
nugets to 25.4.0.2.
EDIT 2: The problem occured after upgrading Xamarin.Forms
from 2.3.5.256-pre6
to 2.4.0.266-pre1
.
I installed version 2.0.0.37-beta of Xam.Plugin.Iconize and Xam.Plugin.Iconize.Material, which is compatible to ".NETPortable,Version=v4.5,Profile=Profile111".
With initalizing within the Xamarin.Android project by
Plugin.Iconize.Droid.IconControls.Init(Resource.Id.toolbar, Resource.Id.tabs);
I get the error that the namespace name "Droid" could not be found within namespace "Plugin.Iconize".
And also "Resource.Id.tabs" doesn't exists..
What am I doing wrong?
I am curious if there is any plan to offer font awesome 5 support in the future?
I have a page with IconToolBarItems on it. It works fine on iOS and UWP, but only works for a while on Android.
I haven't been able to narrow down what breaks it, but after a while they switch to text and I get messages like the following:
Could not load image named: {0}: md-save
[ResourceType] No package identifier when getting value for resource number 0x00000000
[BitmapFactory] Unable to decode stream: java.io.FileNotFoundException: md-save (No such file or directory)
[ResourceType] No package identifier when getting value for resource number 0x00000000
FileImageSourceHandler: Could not find image or image file was invalid: File: md-save
Additionally, one of the icons that has IsVisible="false"
becomes visible, presumably because of some part of the normal Forms logic.
I'm using:
Xam.Plugin.Iconize 2.0.0.37-beta
Xam.Plugin.Iconize.Material 2.0.0.37-beta
Xamarin.Forms 2.5.0.122203
and this is running on Android 8.1, but I've seen it on other versions. I also have FastRenderers_Experimental
enabled if it matters.
Hello,
if want to use my own ttf file, where do i have to put it?
Regards,
Dirk
Icons in the toolbar items are disappearing whenever i switch tabs within a view.
Can we PLEASE get an updated version in NuGet? It's been 6 months and you've made quite a few improvements and fixes!
I tried to see if the icon works " <iconize:IconButton Grid.Row="0" Grid.Column="2" TextColor="Red" FontSize="20" Text="heart" HeightRequest="20" WidthRequest="20" />"
but it doesn't appear, someone that could help me I am using 2.0.0.29-beta version
I meet a small problem with Iconize: before using it in my project, I used a custom renderer on Android
to display or hide an TitleIcon in the NavigationBar.
This worked well by:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:elevation="4dp">
<ImageView
android:src="@drawable/navbar_adp_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:id="@+id/toolbar_icon"
/>
</android.support.v7.widget.Toolbar>
[assembly: ExportRenderer(typeof(NavigationPage), typeof(CustomNavigationPageRenderer))]
namespace MyProject.Droid.Renderers
{
public class CustomNavigationPageRenderer : NavigationPageRenderer
{
protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
if (e.PropertyName.Equals("CurrentPage"))
ChangeToolbarIconVisibility(Element.CurrentPage is MyHomePage);
}
private void ChangeToolbarIconVisibility(bool visible)
{
var toolbarIcon = FindViewById<ImageView>(Resource.Id.toolbar_icon);
toolbarIcon.Visibility = visible ? Android.Views.ViewStates.Visible : Android.Views.ViewStates.Gone;
}
But since I've added Iconize this doesn't longer work:
I've tried to replacing:
[assembly: ExportRenderer(typeof(NavigationPage), typeof(CustomNavigationPageRenderer))]
by
[assembly: ExportRenderer(typeof(IconNavigationPage), typeof(CustomNavigationPageRenderer))]
but in this case, I don't "go" into the renderer, where I put breakpoints...
Is this normal? Is there a way to fix this?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.