Comments (10)
The icon view is based on the new Microsoft Edge (Chromium), so you cannot remove the extra space left on the left side of the menu item. If you use a checkbox item, the icon is check.
It is not possible to add fontawesome icons, as the variable for icon that provides electron is used. In any case, I'll check it out and be reporting the progress right here.
from custom-electron-titlebar.
It is not possible to add fontawesome icons, as the variable for icon that provides electron is used.
Thanks - so i was guessing right.
Having access to fontawesome would it make much easier to fill all those icons needed for a complex menu ... but i understand if that's not the project target.
In any case, I'll check it out and be reporting the progress right here.
So should i keep the issue open as you consider supporting it?
from custom-electron-titlebar.
I haven't tried it yet but you should be able to use fontawesome icons directly using their SVGs.
See: https://github.com/FortAwesome/Font-Awesome/tree/master/svgs
from custom-electron-titlebar.
Hi @janvorisek
I haven't tried it yet but you should be able to use fontawesome icons directly using their SVGs.
Seems like it doesnt work.
I did try with a classic image like in the example - that works
icon: __dirname + '/app/img/icon/icon.png',
Then i tried applying that to an fontawesome svg like that
icon: __dirname + '/node_modules/@fortawesome/fontawesome-free/svgs/regular/address-book.svg',
This throws no error, but the entire submenu entry is missing
So while my file menu containes
- Settings
- Separator
- Exit
it then only showed
- Separator
- Exit
from custom-electron-titlebar.
@yafp That's strange. Can you check if SVGs are loading correctly in your app (webpack/rollup config)? It's still strange that the item is missing. I'd expect an error/empty image instead.
from custom-electron-titlebar.
@yafp Converting the icons you want into PNGs and including them in your app may be possible too. Brutal but could be a temporary solution 😄
from custom-electron-titlebar.
Oh, i have to correct myself.
Not only the 1 item is missing - instead it seems like my app is falling back to the electron default menu entries.
from custom-electron-titlebar.
I have to correct myself as well. I investigated electron menu a bit and the icon accepts NativeImage which cant be SVG according to the electron docs.
My current idea is to load the SVGs in my app main.ts using webpack and manually converting each into a NativeImage which can then be supplied directly to the MenuItem item prop. I'll share some sample code if I am successful 😄. I am also curious for any simpler solutions/examples.
from custom-electron-titlebar.
I have to correct myself as well. I investigated electron menu a bit and the icon accepts NativeImage which cant be SVG according to the electron docs.
Good catch, thanks @janvorisek
for the sake of completeness
While trying to use the .svg my error reporting using Sentry game me the following:
TypeError
Error processing argument at index 1, conversion failure from /home/foo/bar/app/img/address-book.svg
Array.forEach
Called from: electron/js2c/browser_init.js in Function../lib/browser/api/menu.js.Menu.buildFromTemplate
Array.forEach
Called from: electron/js2c/browser_init.js in Function../lib/browser/api/menu.js.Menu.buildFromTemplate
app:///main.js in createMenu at line 239:21
While i noticed no error output in the console.
No idea if it's possible to handle that better to prevent falling back to the default menu.
from custom-electron-titlebar.
to sum it up:
- Using FontAwesome is not possible
- Menu Icons (introduced with #43) can't be disabled
from custom-electron-titlebar.
Related Issues (20)
- [Windows] Hovering menu two options are highlighted HOT 5
- Cannot hide menu or change menu HOT 2
- Problem that two menus are not displayed. HOT 2
- Link to titlebar documentation is dead HOT 2
- The icon option crashes the toolbar
- Window Maximization button not change when window is maximized
- When I mouse-click the titlebar, the window does not get focus
- ERR_PACKAGE_PATH_NOT_EXPORTED on build
- Not sure how to add menu items HOT 1
- [Bug] Linux titlebar is broken? HOT 1
- Focus vc NonFocus revist? HOT 4
- Use getMenu instead of getApplicationMenu
- updateMenu should be public HOT 1
- OS detection fails in packaged/production builds, causing `undefined` instead of menu icons
- Impossible to update the menu HOT 1
- Title moves to the left after resizing HOT 5
- The submenus are not aligned with the title menu HOT 2
- [New Feature] Customize the title bar right-click menu and right-click events
- Click eventListener is not working for menu that doesn't have any submenu
- BUG: Window minWidth and minHeight not working (FIX) HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from custom-electron-titlebar.