Pop gesture stopped working when topBar is hidden - react-native

Swiping on the edge of the screen to pop was working for weeks until suddenly it stopped working after a rebuild of my app. Possibly in between updating package.
Whenever I set the topBar to visible: false, the pop gesture (swipe on the edge of the screen) won't trigger a pop anymore.
topBar: {
drawBehind: false,
visible: true,
animate: false,
}
I'm using 2.1.3-patch.2 for react-native-navigation.
For react-native I'm using 0.57.7
I would love to know if I'm maybe missing a something?

Related

How can I make the splash screen on a React-Native Expo app ADA compliant?

I am releasing an Expo app in the Google Play Store, and my Pre-launch report is rendering an accessibility error for my Splash Screen.
The error says: This item may not have a label readable by screen readers.
How do I add an accessibility label to the Splash Screen? The Splash Screen renders from the splash object in the app.json file. Here is an example:
"splash": {
"image": "./assets/images/logos/logo.png",
"resizeMode": "contain",
"backgroundColor": "#000000"
},
I looked for documentation about Expo Splash Screen Parameters, but I have not found any that were ADA specific.
Will I have to customize my own Splash Screen, and not use Expo's default screen, in order to make it accessible?

How to create a window in tauri with kiosk mode? (mac os, windows os)

In electron, I can easily create a kiosk window by just adding a param kiosk: true.
But in tauri, is there any way to achieve that? I searched their official doc and couldn't find any.
Note: Here I'm referring to creating a window in fullscreen without topbar/ header and borders and it prevents the users to interact with other OS functionalities unless the user exists/ closes the app.
In tauri.conf.json you can find and modify window params like
"windows": [
{
"fullscreen": true,
"height": 600,
"resizable": true,
"title": "main",
"width": 800,
"alwaysOnTop": true,
"maximized": false,
"decorations": false
}
]
for mas details read this: https://tauri.app/v1/api/js/window/#windowmanager

electron: app's icon resolution goes down compared to after having run electron-builder

I'm building an electron app, and the above image on the left is how my icon looks in the app when i'm testing it with electron and on the right is after I've compiled it into an executable using "yarn dist".
(these are screenshots of them from my windows bar at the bottom of the screen).
It seems like the resolution of the icon in the executable is worse than in the raw electron app. The file itself is quite high resolution:
The icon is called during development by the "main.js" file:
mainWindow = new BrowserWindow({
// frame: false,
title: "Collector: Kitten " + app.getVersion(),
icon: __dirname + "/logos/collector.png", //<--- This line
webPreferences: {
//contextIsolation: true, //has to be false with the way I've designed this
enableRemoteModule: true,
preload: path.join(__dirname, 'preload.js'),
worldSafeExecuteJavaScript: true
}
})
And is identified by the builder in the package.json "win":
"build":{
"win": {
"target": "nsis",
"icon": "logos/collector.png"
}
}
Is there a way to prevent this loss in resolution when using the electron-builder?
I solved this by converting the .png into a .ico file and using that instead.

Frustration with inconsistent Emmet results in VSCode

I moved to VSCode from ST3 about 6 or 7 months ago now and overall am loving it. But I'm really struggling with inconsistencies in how Emmet/VSCode expands text...
For example: (these examples are as per the cheat sheet)
fl should give me float:left, but instead i get flex: gif
m:a should give me margin:auto - although since ST3 i've always used m- for this. However in VScode: I get max-block-size: gif
ttu should give me text-transform:uppercase, but instead I get text-underline-position:
p20-40 should give me padding: 20px 40px but in this case, nothing happens - doesn't recoginize it at all
w100p should give me width:100% but again, doesn't even recognize it <-- probably the most annoying one because I use this so often.
and even HTML borks out quite often: .div-class becomes .div-class<?php <-- no idea whats going on here... gif
It almost seems that VSCode has its own built-in Emmet, which is always conflicting with actual Emmet. I'll be the first to admit that it might be a conflicting option in my settings.json, so here is my settings file:
{
"editor.tabSize": 2,
"editor.minimap.enabled": false,
"editor.acceptSuggestionOnEnter": "smart",
"editor.wordBasedSuggestions": false,
"editor.quickSuggestions": {
"other": true,
"comments": false,
"strings": true
},
"editor.tabCompletion": true,
"editor.renderWhitespace": "boundary",
"editor.snippetSuggestions": "top",
"editor.occurrencesHighlight": false,
"editor.selectionHighlight": false,
"editor.renderIndentGuides": true,
"editor.autoIndent": true,
"php.suggest.basic": false,
"php.validate.executablePath": "/usr/local/php5/bin/php",
"workbench.colorTheme": "Bimbo Theme",
"workbench.iconTheme": "vs-seti",
"workbench.startupEditor": "none",
"workbench.editor.tabCloseButton": "left",
"workbench.commandPalette.preserveInput": true,
"workbench.tips.enabled": false,
"window.zoomLevel": 0,
"git.enableSmartCommit": true
}
I have removed settings relating to font sizes and themes etc.
Other Info:
VSCode Version 1.15.1 (1.15.1)
Extensions
Would really appreciate it if someone who isn't experiencing these issues could share their settings file so I can fix my frustration and carry on loving VSCode?
Thanks :)
That's because Emmet is interfering with autocomplete. Try typing any of these commands and execute from command palette Emmet: Expand Abbreviation.
You can remap keybinding for emmet command editor.emmet.action.expandAbbreviation
You can disable autocomplete for css (to show autocomplete when needed Trigger Suggest Ctrl+Space)
"[css]": {
"editor.quickSuggestions": {
"other": false,
"comments": false,
"strings": false
}
}
From version 1.16 August 2017 you can move emmet snippets on top and still have autocomplete:
"emmet.showSuggestionsAsSnippets": true,
"editor.snippetSuggestions": "top"

Sencha Touch Scrolling Issue on IE10 Desktop

Unable to make scrolling to work properly on 64bit IE10 Win7.
Main.js
Ext.define('ScrollLab.view.Main', {
extend: 'Ext.Container',
xtype: 'main',
requires: [
],
config: {
layout: 'vbox',
itemId: 'mainPanel',
scrollable: true,
items: [
{
xtype: 'container',
html: 'Sencha Touch 2.3 is the latest version of our industry-leading mobile app framework. In Sencha Touch 2.3 we updated the device APIs to make Apache Cordova a fully supported component in the library, including support (using the latest version of Sencha Command) for the Adobe PhoneGap Build. Touch 2.3 also includes two brand new themes: Cupertino and Mountain View, in addition to several enhancement to existing themes, especially the Blackberry 10 theme. Other enhancements in Touch 2.3 include full support for XMLHTTPRequest Level 2 (XHR2) on devices that support it, and a new ProgressIndicator Component to give users a true indication when uploading. Read more about all the new features of Touch 2.3.',
width: '100px'
}
]
}
});
MainController.js
Ext.define('ScrollLab.controller.MainController', {
extend : 'Ext.app.Controller',
requires : [
],
config:{
refs:{
mainView: 'main'
},
control:{
mainView: {
activate: 'onMainViewActivate'
}
}
},
onMainViewActivate: function(view) {
"use strict";
var me=this;
var container = view;
if(container.isXType('selectfield')) {
container = container.down('list');
}// Add support for selectbuttons
// Disable default scroll for mobile.
container.getScrollable().getScroller().setDisabled(true);
console.log(me.getMainView().element.dom);
var scrollContainers = Ext.DomQuery.select('.x-scroll-view', me.getMainView().element.dom);
var scrollBars = Ext.DomQuery.select('.x-scroll-indicator', me.getMainView().element.dom);
for(var i=0;i<scrollContainers.length;i++){
scrollContainers[i].style.overflowY = "scroll";
}
for(i=0;i<scrollBars.length;i++) {
scrollBars[i].style.zIndex = "-1";
}
console.log(scrollContainers);
console.log('Length - ' + scrollContainers.length);
}
});
This code enables the scroll but it freeze me on the current view and doesn't let me scroll up/down when content overgrows the screen.
This piece of code works great for Webkit browsers(Chrome, Safari) but doesn't work well on IE10.
I figured it out. Not a single solution. For different components I had to enable Scroll bars differently. But key thing is using overflow: scroll and height 100% CSS property at the right place in DOM.
Feel free to reach me if you need suggestions.