I'm working on a desktop time management application using electron. And I'd like to put a counting down timer on the menu bar. But right now the icon size needs to be 20*20. Is it possible to change the icon size in electron?
As seen in this Github link you can use nativeImage command:
const nativeImage = require('electron').nativeImage
...
{
label: 'Open-Source',
icon: nativeImage.createFromPath(__dirname + '/resources/icons/github.png').resize({width:16}),
click: async () => {
//
}
}
You can create images with numbers then make a logic to set icons after X seconds and also use the nativeImage function to resize it with your mentioned size.
Related
I'm developing a React Native app using React Navigation v4, React Hooks and ES6.
I have 2 bottom tabs (Movies, Shows) and 4 screens with the following Stack structure:
**Movies**
-- MovieList
-- MovieDetail
**Shows**
-- ShowList
-- ShowDetail
My scenario
1) Moving from Movie list to an individual movie page
MovieList contains a list of movies, when I click on one of them, I first fetch some API data then move to the MovieDetail screen like this
dispatch(apiFetchActions.fetchMovies(movieId)).then((response) => {
props.navigation.navigate({
routeName: "MovieDetail",
params: {
assetId: movieId,
assetName: movieTitle,
},
});
MovieDetail is now on top of the Movies stack and MovieList at the bottom
2) Moving to a different tab (navigation stack)
I then click on Shows (2nd Tab) which takes me to the ShowList using props.navigation.navigate('ShowList')
3) The problem
If I click on the Movies Tab, I expect to be moved back to MovieList but since MovieDetail was never unmounted, it is still at the top of the Movies stack meaning that I see an old screen. I have to click twice to go back to the MovieList screen.
I've read quite a few suggestions on how to use onFocus/onBlur subscription however I could not found a solution using React Hooks.
My ideal solution would be to find a way to listen to the onBlur status in MovieDetail screen possibly using useEffect hook and somehow unmount it before leaving.
I found a way to make it easier to always move to the initial top of the stack when you click on any bottom tab icons.
You simply need to add the on Press and the screen reference like this
Stars: {
screen: StarsNavigator,
navigationOptions: ({ navigation }) => ({
tabBarIcon: (tabInfo) => {
return (
<Ionicons name="ios-people" size={22} color={tabInfo.tintColor} />
);
},
tabBarLabel: Platform.OS === "android" ? <Text>Stars</Text> : "Stars",
tabBarOnPress: () => {
navigation.navigate("StarsList");
},
}),
},
Star is one of my screens in BottomTabNavigator and using navigation.navigate("You Screen") does the trick. So regardless in which level of the stack you find yourself, every time you click on the Star tab you always end up to the original top level.
I am using angularjs-dragula and I am not able to auto scroll to the overflow container that is hidden from the screen.
This is my issue:
I have five containers in my dragula and the 5th container is hidden from the screen. Now I want to drag an element from the first container and drop it in the 5th container. But I am not able to do this, since the screen is not auto scrolling to the 5th container.
Does angularjs-dragula support vertical scrolling? or is there a property that I'm missing?
Example Plunkr : https://plnkr.co/edit/iD38MugmHIx298p7OlrI?p=preview
var app = angular.module('angular-dragula-demo', [angularDragula(angular)]);
app.controller('MainCtrl', function($scope, dragulaService) {
dragulaService.options($scope, 'fifth-bag', {
copy: true
});
});
It seems like this option is not implemented in Dragula. Dragula's developer suggests to use the module dom-autoscroller.
See this issue on Github: https://github.com/bevacqua/dragula/issues/121
To implement this functionality with AngularJS:
1) Download dom-autoscroller from the official repo: https://github.com/hollowdoor/dom_autoscroller/blob/master/dist/dom-autoscroller.min.js
2) Include it in your project folder
3) Enable autoscroll in your controller:
// ENABLE AUTOSCROLL FOR GOALS LIST
var scroll = autoScroll([
document.querySelector('.list')
], {
margin: 30,
maxSpeed: 10,
scrollWhenOutside: true,
autoScroll: function () {
//Only scroll when the pointer is down
return this.down
}
});
developing for Gear s2 web app (Tizen),
how is it possible to scroll a page which has only text, using the bezel?
Thanks.
First you have to listen to the "rotarydetent" events, e.g. like following:
document.addEventListener('rotarydetent', onRotarydetent);
function onRotarydetent(ev) {
var direction = ev.detail.direction;
if(direction === "CW"){ // CW = clockwise; CCW = counterclockwise
... scroll down ...
} else {
... scrull up ...
}
}
So now to scroll the page content it depends on how build your web app. If you use the SDK Wizard and have a project including tau.js it will be simple if you know that tau adds a scroller container around each page. Now you just need to find the scroller and scroll it. Using jQuery it could look like following:
function onRotarydetent(ev) {
var direction = ev.detail.direction,
uiScroller = $('#pageid').find('.ui-scroller'),
scrollPos = $(uiScroller).scrollTop();
console.debug("onRotarydetent: " + direction);
if(direction === "CW"){
$(uiScroller).scrollTop(scrollPos + 100); // scroll down 100px
} else {
$(uiScroller).scrollTop(scrollPos - 100); // scroll up 100px
}
}
Have a look at the UIComponents sample app available within the Tizen Wearable SDK.
You need to use the TAU library to achieve Text scrolling using Beezel.
Create a new project using the UI Components app and Install it on Gear s2 emulator or original hardware. Then Run the app and click on the first option 'Header' which contains your use case i.e. plain text scrollable by beezel.
I use a toolbar button to toggle between normal and private windows.
Here is the code:
OpenBrowserWindow({private: !PrivateBrowsingUtils.isWindowPrivate(window)});
setTimeout(BrowserTryToCloseWindow, 80);
I use 'setTimeout' in order to prevent some flickering.
When the new window opens, it gets the focus.
When the command 'BrowserTryToCloseWindow' is executed, the focus returns to the old window.
When the old window is closed, the new one does have the focus, but it isn't 'checked / active' in Windows Task Bar.
I suppose I need to use ITaskbarList::ActivateTab in order to activate the new window in the task bar.
I have the (very) basic direction:
Components.utils.import("resource://gre/modules/ctypes.jsm");
var lib = ctypes.open("shell32.dll");
var taskBar = lib.declare(---
taskBar---
lib.close();
I'd appreciate your help.
Win 7, 32-bit, Classic Theme.
Posted here too.
Solution:
function togglePB(click)
{
var newWin = OpenBrowserWindow({ private: ! PrivateBrowsingUtils.isWindowPrivate(window) });
if(click.button == 0)
newWin.addEventListener("focus", function switchWindows() { window.focus(); BrowserTryToCloseWindow(); newWin.removeEventListener("focus", switchWindows); });
}
http://forums.mozillazine.org/viewtopic.php?f=19&t=2895755
I am developing an iOS app in Appcelerator and I want to switch between windows with the use of a swipe event listener. How can I do this? The below code does not work. The current window that I "start" from contains a table.
var window = Ti.UI.currentWindow;
window.addEventListener('swipe', function() {
// Create the new window
var win = Titanium.UI.createWindow({
title: 'Contacts',
url:'contacts_simple.js'
});
// Animate the page turn
Titanium.UI.currentTab.open(win, {animated:false});
});
I think the problem is with the Ti.UI.currentWindow. Depending on the context you're working in it may not be valid.
Google 'appcelerator currentWindow', but here's a related link:
http://developer.appcelerator.com/question/5391/currentwindow
This will not be optimal and dynamic, but to start with, try referencing the window implicitly. Meaning if you did something like
var window_x = Ti.UI.createWindow({});
try
window_x.addEventListener('swipe', function() {...});