Icons from antd UI displays as a empty square - antd

I have struggling with one issue during implementing new components with antd UI library.
Every component display correctly but without icons inside. Instead of icon I see empty square.

Maybe you have not installed icon package, antd itself not contain it.
npm install --save #ant-design/icons

Related

Use own menu bar in customized Cordova InAppBrowser Plugin

I have a Cordova iOS app that uses the Cordova InAppBrowser plugin. The InAppBrowser has been modified natively so that a menu bar is displayed as a header above the InAppBrowser, so that various other functionalities can be used (e.g. a drawing/screenshot function). To fulfill this requirement, the InAppBrowser plugin was forked and adapted: In addition to the standard parameters of the InAppBrowser plugin you can add offsets to our customized InAppBrowser to avoid filling the whole display and to have the possibility to show the above mentioned menu bar in the empty area.
This worked successfully for years with the following versions:
Cordova: 6.5.0
Cordova-iOS: 4.5.2
InAppBrowser Plugin: 1.6.1
After upgrading to the latest Cordova Framework we currently have the following versions in use:
Cordova: 10.0.0
Cordova-iOS: 6.1.1
InAppBrowser Plugin: 4.0.0
The InAppBrowser Plugin is forked in the same way as the old version, so that a menu bar can be displayed at the top. This seems to work optically correct respectively as before. But if you click on our navigation bar now, it doesn't react. So it looks like the plugin or the WkWebView makes an invisible glass pane over the navigation bar. You don't see this "glass pane" in the DOM elements, so it is likely that this happens somehow natively. For example, if you make a URL with "toolbar=yes", you have the possibility to close the InAppBrowser and only then, you have access to the navigation bar behind it and you can use the menu elements. There are also several parameters in the InAppBrowser plugin, which can be passed when opening a URL (e.g. PresentationStyle), but they don't have any effect.
Who had this problem and could solve it? How?

Custom Component Icons Not Showing in Delphi 10.3

I just moved from Delphi 7 to 10.3 and was trying to install some of my older (VCL) custom components. I was finally successful in getting the code to compile, but I'm having trouble with something that seems like it should be trivial. The icons for the custom component(s) in the palette show what looks like a default icon instead of the icon(s) I expected. There are lots of posts on here (most are over 5 yrs old) about component icon issues and I've tried self-compiling the .rc file, including the{ $R .rc} in the package source and using the Project/Resources and Images dialog to specify the icons. I've tried 8-bit, 16-bit, 24-bit icons that are 24x24. Then as a test, I followed the exact procedure shown here which included some of the more recent content on this issue that I could find. I tried with bitmap files at full resolution and 32bpp and 24x24 at 8bpp. In both cases, the default icon showed for this test component. I'm probably overlooking something simple, but I'm kind of at a loss on what to try next. Is there a different procedure for specifying icons for custom components in 10.3 compared to older versions?
Edit: An update - I reinstalled my custom component and then rebooted and then was able to see the correct icon reflected in the palette, but here's where it gets strange. The test component I linked above still shows a default icon even after reinstalling and rebooting, and even stranger, is that the second I use my custom component on a form, the icon in the palette reverts to a TEdit icon (the component is a descendant of TEdit). Closing Delphi and reopening restores the icon until it is used again.
I'm not sure whether I should answer my own question, but just wanted to update in case it helps someone later. I was finally able to get the sample test component icon to show by using the -nocache option as described here. I then cleared the registry cache for my own component (dclusr) as shown in the same post and then also changed the bitmaps from 8bpp to 32bpp and now everything seems to be working as expected. I then cleared the registry keys for the sample project, and I can run without the -nocache option and all icons show fine, so I am thinking it was mostly a cache issue which I never would have found without the referenced post.

Add / use custom SVG as material-icon

I'm using the material design package for my application layout menu.
I have 2 menus items where I can't find an icon that fits, so I got 2 SVG files that I added to the project.
I want to use this as the material-list-item icon instead of a material-icon.
Is there a way to do this by either adding a custom icon to the material-icon library or replacing the icon in the list.
If yes, please I need a complete example as I am new to DartAngular, still trying to figure out some stuff.
There is a mixin for material-icon which will get allow you to change a material-icon into using an SVG. https://github.com/dart-lang/angular_components/blob/c6cb3d783e72ff1ed7974f18b7f169778c73d39b/angular_components/lib/material_icon/_mixins.scss#L49
There is indeed a mixin for this as pointed out in Ted Sander's answer, but for the moment it does not seem to work. I've asked this on Gitter but did not get an answer, and I also opened a ticket on Github for this seemingly broken feature.
It's a telltale sign that even the official Angular Components Gallery has a broken SVG icon example.
I'd suggest to implement this by using separate list item rendering for those that have an official material-icon representation and those that need a custom SVG image, and conditionally render them with the ngIf directive.

How to create stacked icons using angular material icons?

I have found "Material Design Iconic Font" library which is similar to md-icon and allow to create a stacked icon:
http://zavoloklom.github.io/material-design-iconic-font/examples.html
But wasn't able to create a stacked icon combining angular material icons.
https://material.angularjs.org/latest/api/directive/mdIcon
I'm already using angular material icons in my project, and don't want to include another library just for stacked icon.
Is there any way/work around we can combine md-icons to create a stacked angular material icons?
I laso had this problem once, if you want to do that you will need to use CSS for that.
Create 2 icon tags, put them in a container tag, and give this container a class.
Now you need to use CSS to stack the icons.
(you might want to set the position of the 3 tags to relative so they stack easily).

How can I style a ListPicker to behave just like the native ListPick in the OS settings pages?

I am using the ListPicker from the toolkit. I have managed to apply a style template so that when the user is selecting from a list of items in fullscreen mode, it looks somewhat similar to the native WP7 implementation.
However, there are a few things missing that appear on the native implementation:
On full mode enter, the items appear via an animation
When at item is selected, it stays highlighted for an instant, then the items disappear via an animation
Am I missing something or is this simply just not exposed to 3rd party developers using silverlight at this point in time?
Animations are provided in November Toolkit. Download the latest version, please
Check the other posts in the same site .. http://www.windowsphonegeek.com/tips/how-to-customize-the-listpicker-selected-item

Resources