How can i display System Tray or App Icon with electron - electron.net

Iam trying to add a App Icon to my Electron.Net Application but the Icon isn't Displayed in the Taskbar / System Tray,
What i did:
in electron.manifest.json i have
"linux": {
"icon": "../../../wwwroot/build/icons/256x256.png",
"category": "Office"
},
in the Startup.cs
var window = await Electron.WindowManager.CreateWindowAsync(new BrowserWindowOptions{
Width = 1280,
Height = 756,
Fullscreenable= false,
HasShadow= true,
AutoHideMenuBar=true,
Maximizable= false,
Icon = "../../../wwwroot/build/icons/32x32.png"
});
First i checked if the filepath is right and yes its right, i tryed different folders, different filenames but nothing worked.
I hope you guys can help me.

To create a tray icon, add this code on your app startup (Startup.cs in your case, Program.cs for NET6) before app.Run();:
var TrayMenu = new MenuItem[]
{
new MenuItem{
Label = "Show window",
Click = () => { Electron.WindowManager.BrowserWindows.First().Show(); }
},
new MenuItem{
Label = "Hide",
Click = () => { Electron.WindowManager.BrowserWindows.First().Hide(); }
},
new MenuItem{
Label = "Quit",
Click = () => { Electron.App.Exit(0); }
}
};
Electron.Tray.Show("/your/logo/here.png", TrayMenu);
And as to it not showing in taskbar you probably disabled it somewhere in your code, provide more info.
Perhaps it has something to do with your disabled fullscreen/resize thing in Startup.cs?

Related

Cannot drag file onto Electron app dock icon

I want to try to build out a simple Electron based macOS app that let's a user drag a file to the app's dock icon and then does something with that file.
However I cannot find a way to drag a file to the dock icon and detect that event. I notice that when I hover over the dock icon with the file it doesn't look like I can drag it there (the icon doesn't go darker as it does with with Safari or Notes).
I followed the official Quick Start guide to create a minimal electron app for starter.
I found little guidance on what a would like to do but came up with the following code that is able to open the window, load my blank index.html but doesn't achieve anything drag related.
main.js
const { app, BrowserWindow } = require("electron");
/* Create and open the App */
app.whenReady().then(() => {
createWindow();
app.on("activate", () => {
if (BrowserWindow.getAllWindows().length === 0) createWindow();
});
});
const createWindow = () => {
const win = new BrowserWindow({
width: 800,
height: 600,
titleBarStyle: "hidden",
});
//win.loadURL("https://electronjs.org");
win.loadFile("index.html");
win.show();
process.argv.forEach(handleFile);
console.log("window opened");
console.log(process.argv);
};
/* Drag file unto App icon */
app.on("open-file", handleFile);
app.on("open-url", handleFile);
// You can get the dragged file's path like this
if (process.argv.length >= 2) {
const filePath = process.argv[1];
handleFile(filePath);
}
// If you only allow a single instance of your application to be running
// you should use the 'second-instance' event to handle the case if your app is already running
const gotTheLock = app.requestSingleInstanceLock();
if (!gotTheLock) {
app.quit();
} else {
app.on("second-instance", (event, argv, workingDirectory) => {
// Someone tried to run a second instance
// Handle argv here
if (argv.length >= 2) {
const filePath = argv[1];
handleFile(filePath);
}
});
}
function handleFile(filePath) {
// handle the file as you want
console.log("handleFile", filePath);
}
Thanks for any guidance in a good direction!
Aaron

How to interact with camera roll in Xamarin.UITesting?

I have been trying to tap on Camera Roll in Xamarin.iOS, using Xamarin.UITesting when it opens in my application but as it is part of the OS, I am unable to use Tap function to select the camera roll and then an image. Using the app.Repl() , it just appears as this:
[CalabashRootView]
[UIWindow > ... > UILayoutContainerView]
[UINavigationTransitionView > ... > _UISizeTrackingView]
[_UIRemoteView] id: "RemoteViewBridge"
[UINavigationBar] id: "Photos"
[_UIBarBackground]
[UIImageView]
[UIVisualEffectView]
[_UIVisualEffectBackdropView]
[_UIVisualEffectSubview]
[_UINavigationBarContentView]
[_UIButtonBarStackView]
[_UIButtonBarButton] label: "Cancel"
[_UIModernBarButton] label: "Cancel"
[UIButtonLabel] label: "Cancel", text: "Cancel"
[UILabel] label: "Photos", text: "Photos"
[UILabel] label: "Photos", text: "Photos"
[_UIButtonBarButton] label: "Cancel"
[_UIModernBarButton] label: "Cancel"
[UIButtonLabel] label: "Cancel", text: "Cancel"
[UIWindow > UILayoutContainerView]
[UINavigationTransitionView > ... > UITableView]
[WelcomeScreenCustomCell]
[UITableViewCellContentView]
[UIView]
I have tried to just push an image into the photo selection process through a backdoor but I can't seem to get it working properly (this is my AppDelegate):
[Export("selectImageFromCameraRoll:")] // notice the colon at the end of the method name
public NSString SelectImage(NSString value)
{
UIImage photo = UIImage.FromFile("testImage.jpg");
NSData imgData = photo.AsJPEG(0.6f);
UIImage img = new UIImage(imgData);
var vc = window.RootViewController;
//not working
((UIDataViewController)vc.Handle).TakenPhoto(img);
return new NSString("true");
}
Has anyone had any experience of this and is there a way to just select an image?
You could use the plugin MediaPlugin from Nuget .
Don't forget to add NSCameraUsageDescription and NSPhotoLibraryUsageDescription in indo.plist in order to access the device's camera and photo/video library.
<key>NSCameraUsageDescription</key>
<string>This app needs access to the camera to take photos.</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>This app needs access to photos.</string>
<key>NSMicrophoneUsageDescription</key>
<string>This app needs access to microphone.</string>
<key>NSPhotoLibraryAddUsageDescription</key>
<string>This app needs access to the photo gallery.</string>
And you could better call the code in MainViewController
async void TakePhoto()
{
await CrossMedia.Current.Initialize();
if (!CrossMedia.Current.IsCameraAvailable || !CrossMedia.Current.IsTakePhotoSupported)
{
// No camera available.
return;
}
var file = await CrossMedia.Current.TakePhotoAsync(new StoreCameraMediaOptions
{
Directory = "Sample",
Name = "test.jpg"
});
if (file == null)
return;
var ImagePath = file.Path;
//... do something you want
}

How to remove firefox 36 badge text

Since firefox 36 it is possible to set badge text for a firefox add-on icon:
var { ToggleButton } = require("sdk/ui/button/toggle");
var button = ToggleButton({
id: "my-button1",
label: "my button1",
icon: "./icon-16.png",
onChange: changed,
badge: 0,
badgeColor: "#00AAAA"
});
function changed(state) {
button.badge = state.badge + 1;
if (state.checked) {
button.badgeColor = "#AA00AA";
}
else {
button.badgeColor = "#00AAAA";
}
}
However, it is not clear to me how to remove the badge text. Just setting its color to transparent does not work, since the text is still displayed and the background of the badge has a gradient (which is even in transparent mode visible).
To fully remove the badge text set it to an empty string, i.e. button.badge = "";

Master Detail Page on the right side using Xamarin.Forms

I've created a master detail page on the left side using Xamarin.Forms, how about creating the same for the right side?
Below is my sample code for the left slider menu;
public class App
{
static MasterDetailPage MDPage;
public static Page GetMainPage()
{
return MDPage = new MasterDetailPage {
Master = new ContentPage {
Title = "Master",
BackgroundColor = Color.Silver,
Icon = Device.OS == TargetPlatform.iOS ? "menu.png" : null,
Content = new StackLayout {
Padding = new Thickness(5, 50),
Children = { Link("A"), Link("B"), Link("C") }
},
},
Detail = new NavigationPage(new ContentPage {
Title = "A",
Content = new Label { Text = "A" }
}),
};
}
static Button Link(string name)
{
var button = new Button {
Text = name,
BackgroundColor = Color.FromRgb(0.9, 0.9, 0.9)
};
button.Clicked += delegate {
MDPage.Detail = new NavigationPage(new ContentPage {
Title = name,
Content = new Label { Text = name }
});
MDPage.IsPresented = false;
};
return button;
}
}
This does not exists in the Xamarin.Forms controls set, but you can create your own, with renderers for each platform.
You'll find the required information on http://developer.xamarin.com/guides/cross-platform/xamarin-forms/custom-renderer/
Solution here
this is now supported in xamarin forms 3.0 and up, NO custom renderers
needed !! or third party libraries.
the trick is to force the layout to RTL,
while flow direction works, its hard to make the top nav bar to follow,
below is the solution for that problem, it works... let me know if you face any issues on older ios versions IOS8 and less.
xamarin forms RTL master details page with icon RTL/LTR hamburger
You can make it by ToolbarItems in Xamarin Forms
ToolbarItems will appear in right side.
You can find more info from the following links :
http://codeworks.it/blog/?p=232

Firefox extension, opening a local file in a new foreground tab from menu

I am learning how to program Firefox extensions. I have created a new menu and when the menu item is clicked, I want a new tab to be opened, in the foreground, containing a local file contained within the contents directory.
For example:
MENU -> Item1
When Item1 is selected, I want a new tab to open in the foreground containing what is located in /myextension/content/content.html.
Where can I find out how to do this?
For clarity, I can get the local file to open in a new tab, I just do not know how to get to open in a new focused tab.
I use the following function to open a tab, make sure it hasn't already been opened and switch focus to it:
function OpenAndReuseOneTabPerURL(url)
{
var wm = Components.classes["#mozilla.org/appshell/window-mediator;1"].getService(Components.interfaces.nsIWindowMediator);
var browserEnumerator = wm.getEnumerator("navigator:browser");
// Check each browser instance for our URL
var found = false;
while (!found && browserEnumerator.hasMoreElements())
{
var browserWin = browserEnumerator.getNext();
var tabbrowser = browserWin.gBrowser;
// Check each tab of this browser instance
var numTabs = tabbrowser.browsers.length;
for (var index = 0; index < numTabs; index++)
{
var currentBrowser = tabbrowser.getBrowserAtIndex(index);
if (url == currentBrowser.currentURI.spec)
{
// The URL is already opened. Select this tab.
tabbrowser.selectedTab = tabbrowser.tabContainer.childNodes[index];
// Focus *this* browser-window
browserWin.focus();
found = true;
break;
}
}
}
// Our URL isn't open. Open it now.
if (!found)
{
var recentWindow = wm.getMostRecentWindow("navigator:browser");
if (recentWindow) {
// Use an existing browser window
recentWindow.delayedOpenTab(url, null, null, null, null);
} else {
// No browser windows are open, so open a new one.
window.open(url);
}
}
}
Use it like:
OpenAndReuseOneTabPerURL("http://yoururl.com");

Resources