How to determine Watch Orientation (i.e. is the Digital Crown on the right or the left?) - watchos

I wanted to know how to determine whether the Digital Crown is at the upper right or the lower left.
Since I found the solution I wanted to let others know as well. See answer...

if WKInterfaceDevice.current().crownOrientation == .right {
()
} else {
()
}

Related

How can one write a WatchOS widget for accessoryCorner family that renders appropriately?

I'm trying to build a widget that has a gauge like in the image attached. It does not seem like there are any APIs to render the gauge (or any other view for that matter) on an arc, depending on which corner is used.
Is there any such support, or are such widgets only available to Apple? E.g. can one tell which corner the widget is being rendered in, so that the correct transformations be computed?
Thank you!
You can get close to an Apple style corner widget, but there are currently some limitations. As far as I know you have to use the .widgetLabel modifier which restricts you to an "Image, Text, Gauge, ProgressView, or a container with multiple subviews".
The styling for the Gauge and ProgressView seem to be predefined as well - for example styling the gauge with .gaugeStyle(LinearCapacityGaugeStyle()) doesn't change the appearance.
var body: some View {
switch widgetFamily {
case .accessoryCorner: // WatchOS only
Text("50%") // Watch out for clipping
.font(.system(size: 20))
.foregroundColor(.blue)
.widgetLabel {
ProgressView(value: 0.5)
.tint(.blue)
}
}
}
or
var body: some View {
switch widgetFamily {
case .accessoryCorner: // WatchOS only
Text("50%") // Watch out for clipping
.font(.system(size: 20))
.foregroundColor(.blue)
.widgetLabel {
Gauge(value: 50.0, in: 0...100) {
Text("Not shown")
} currentValueLabel: {
Text("Not shown")
} minimumValueLabel: {
Text("0") // Watch out for clipping
} maximumValueLabel: {
Text("100") // Watch out for clipping
}
.tint(.blue)
.gaugeStyle(LinearCapacityGaugeStyle()) // Doesn't do anything
}
Gives you:
You can rotate the text manually to try and make it line up with corner, but as you say then there doesn't seem to be a way to identify which corner the widget is in so you don't know which way to rotate it...

How to use 3rd party camera app with Ionic React Capacitor

Well the point is the following:
import {
Camera,
CameraResultType,
CameraSource,
Photo,
} from "#capacitor/camera";
export function usePhotoGallery() {
// import { usePhotoGallery } from "../hooks/usePhotoGallery"; per usarlo in esterna
const scatta = async () => {
const cameraPhoto = await Camera.getPhoto({
resultType: CameraResultType.Uri,
source: CameraSource.Camera,
quality: 100,
});
};
return {
scatta,
};
}
With this pretty basic code just calls the default camera and makes it take a shot.
It's working fine no problem. The issue comes in, by my case, by the fact that i have a custom ROM with no pre-installed camera. So no default camera. I know pretty much no one would have my issue. But I'd like to cover those 0.1% of user that will have this problem.
So, finally, how can I can use a 3rd party camera app? Or just create one if it's better.
For example I can take photos from Whatsapp, Instagram, Snapchat ecc. I guess cuz they have their own camera. So the point basically is:
How can I make the user select the app he prefers for thake the shot (like the pop-up that ask "open with *choiches*.."
If i can't do the previous option, then how can I do my own camera?
Sorry for my probably disgusting english

Microbit music / scroll output corrupting memory?

My son and I are trying to implement one of the fun-science.org microbit tutorials - building a "tug of war" game. Essentially, 10 presses on button A moves the sprite closer to that button and the same applies on button B. When you hit the edge of the screen, music plays and a message is scrolled on the screen before the game restarts.
We've got it fully working, but once the game has been won, it doesn't seem to reset properly. It works fine on the simulator, but not on the physical device (a microbit 2).
Once the game is won, the behaviour is erratic. It usually puts the sprite back in the middle, sometimes not, but frequently, one button doesn't work in the next game. Occasionally both stop working. In every situation, a restart fixes things.
Is there something wrong with the code? I've wondered whether the music / message is corrupting something and I need to put a wait in for it to complete. I've re-downloaded the hex file and re-flashed the microbit several times, so I think I've eliminated a corrupt code file.
Javascript version of code shown below, but it was actually built in blockly using the Microsoft MakeCode tool.
input.onButtonPressed(Button.A, function () {
sprite.change(LedSpriteProperty.X, -0.1)
})
input.onButtonPressed(Button.B, function () {
sprite.change(LedSpriteProperty.X, 0.1)
})
let sprite: game.LedSprite = null
sprite = game.createSprite(2, 3)
basic.forever(function () {
if (sprite.get(LedSpriteProperty.X) == 0) {
music.startMelody(music.builtInMelody(Melodies.Birthday), MelodyOptions.Once)
basic.showString("liverpool wins")
sprite.set(LedSpriteProperty.X, 2)
} else if (sprite.get(LedSpriteProperty.X) == 4) {
music.startMelody(music.builtInMelody(Melodies.Entertainer), MelodyOptions.Once)
basic.showString("rb leipzig wins")
sprite.set(LedSpriteProperty.X, 2)
}
})
I found it was more reliable if I did game.pause() and game.resume() while scrolling the text and playing the music at the end of the game:
input.onButtonPressed(Button.A, function () {
sprite.change(LedSpriteProperty.X, -0.1)
})
input.onButtonPressed(Button.B, function () {
sprite.change(LedSpriteProperty.X, 0.1)
})
let sprite: game.LedSprite = null
sprite = game.createSprite(2, 3)
basic.forever(function () {
if (sprite.get(LedSpriteProperty.X) == 0) {
game.pause()
music.startMelody(music.builtInMelody(Melodies.Birthday), MelodyOptions.Once)
basic.showString("liverpool wins")
game.resume()
sprite.set(LedSpriteProperty.X, 2)
} else if (sprite.get(LedSpriteProperty.X) == 4) {
game.pause()
music.startMelody(music.builtInMelody(Melodies.Entertainer), MelodyOptions.Once)
basic.showString("rb leipzig wins")
game.resume()
sprite.set(LedSpriteProperty.X, 2)
}
})
You can also take a look at the following version of the game that does not use the game rendering engine https://makecode.microbit.org/projects/tug-of-led to see if that makes a difference.

Character rotation (ActionScript 2.0)

I have some characters in my game on SmartFoxServer BASIC. Characters are controlled using the mouse (like in SFS basic avatarchat example)
I need characters can be rotated in different directions (like in different children MMO, for example Club Penguin).
My character is drawn with 8 sides (East, South-East, South, South-West, West, North-West, North, North-East).
How can I do it ? ActionScript 2.0
Maybe someone here have already made a similar on SFS? Or simply advise how this can be implemented ..
I know that it does not need to do anything on server-side.
(sorry for my english, I am not from an English-speaking country)
Note: I have not tested the following answer myself as I don't have testing environment currently:
Create a movieclip in your stage and insert the character sprites in individual frames of the layer sequentially.
Test to see if your character is rotating clockwise as expected starting from East.
Name the movieclip as "hero" for an instance.
Try the following code:
Actionscript 2:
_root.onEnterFrame = function() {
if (Key.isDown(Key.UP)) {
_root.hero.gotoAndStop(7);
if (Key.isDown(Key.LEFT)) {
_root.hero.prevFrame();
} else if (Key.isDown(Key.RIGHT)) {
_root.hero.nextFrame();
}
} else if (Key.isDown(Key.DOWN)) {
_root.hero.gotoAndStop(3);
if (Key.isDown(Key.LEFT)) {
_root.hero.nextFrame();
} else if (Key.isDown(Key.RIGHT)) {
_root.hero.prevFrame();
}
} else if (Key.isDown(Key.LEFT)) {
_root.hero.gotoAndStop(5);
} else if (Key.isDown(Key.RIGHT)) {
_root.hero.gotoAndStop(1);
}
}

Device check in sencha touch 2

I'm sure I'm just overlooking this question but I cant seem to find how to check the device.
I want to check whether the device is either a phone, a tablet in landscape mode, a tablet in portrait mode or a other device (computer).
What I have is this:
if (Ext.platform.isPhone) {
console.log("phone");
}
if (Ext.platform.isTablet) {
console.log("tablet");
}
var x = Ext.platform;
But platform is undefined (probably because this is the way of Sencha Touch 1).
Does anyone know the correct place for me to access the device check?
Sencha Environment Detection offers a large spectrum through simple means.
Instead of Ext.os.is.Tablet, you can make life easier via Ext.os.deviceType which will return:
Phone
Tablet
Desktop
NB: this value can also be fudged by adding "?deviceType=" to the url.
http://localhost/mypage.html?deviceType=Tablet
Ext.os.name is the singleton returning:
iOS
Android
webOS
BlackBerry
RIMTablet
MacOS
Windows
Linux
Bada
Other
The usual ability of browser detection is available through Ext.browser.name.
Something I've only recently encountered, which I love is feature detection - allowing coding similar to Modernizr / YepNope based off ability of device. Ext.feature offers:
Ext.feature.has.Audio
Ext.feature.has.Canvas
Ext.feature.has.ClassList
Ext.feature.has.CreateContextualFragment
Ext.feature.has.Css3dTransforms
Ext.feature.has.CssAnimations
Ext.feature.has.CssTransforms
Ext.feature.has.CssTransitions
Ext.feature.has.DeviceMotion
Ext.feature.has.Geolocation
Ext.feature.has.History
Ext.feature.has.Orientation
Ext.feature.has.OrientationChange
Ext.feature.has.Range
Ext.feature.has.SqlDatabase
Ext.feature.has.Svg
Ext.feature.has.Touch
Ext.feature.has.Video
Ext.feature.has.Vml
Ext.feature.has.WebSockets
To detect fullscreen/app/homescreen browser mode on iOS:
window.navigator.standalone == true
Orientation Ext.device.Orientation and orientation change:
Ext.device.Orientation.on({
scope: this,
orientationchange: function(e) {
console.log('Alpha: ', e.alpha);
console.log('Beta: ', e.beta);
console.log('Gamma: ', e.gamma);
}
});
Orientation is based on Viewport. I usually add a listener which is more reliable:
onOrientationChange: function(viewport, orientation, width, height) {
// test trigger and values
console.log('o:' + orientation + ' w:' + width + ' h:' + height);
if (width > height) {
orientation = 'landscape';
} else {
orientation = 'portrait';
}
// add handlers here...
}
Use Ext.env.OS's is() method.
Note that only major component and simplified value of the version are
available via direct property checking. Supported values are: iOS,
iPad, iPhone, iPod, Android, WebOS, BlackBerry, Bada, MacOS, Windows,
Linux and Other
if (Ext.os.is('Android')) { ... }
if (Ext.os.is.Android2) { ... } // Equivalent to (Ext.os.is.Android && Ext.os.version.equals(2))
if (Ext.os.is.iOS32) { ... } // Equivalent to (Ext.os.is.iOS && Ext.os.version.equals(3.2))
Alternatively, you can also use PhoneGap Device API
I found the answer to it:
What seems to be the case is that Ext.os.is.(tablet/phone or something else) is true or undefined. If it is not the case it will be undefined.
I.a. Ext.os.is.Tablet is true when on a tablet and undefined when not.
So this is the answer I was looking for
if(Ext.os.is.Tablet){
this._bIsTablet = true;
}else if(Ext.os.is.Phone){
this._bIsPhone = true;
}else{
this._bIsOther = true;
}