How do I set the glyphimage of a MapKit annotation? - mapkit

I know this is basic stuff but the documentation online is thin. I am new to Apple Mapkit and I am trying to create a simple annotation with a glyphImage overlay. I have the annotation working, but when I try to set the glyphImage the map blows up. The code I am using is:
testAnnotation.glyphImage = UIImage(named: "/public/img/site/tester.png");
What am I doing wrong here?

I figured this out:
var testAnnotation = new MarkerAnnotation(test, {
title: "This is a Test!",
subtitle: "Testing Apple MapKit",
glyphImage: {
1: "/images/testimage.png"
}
});

Related

SwiftUI: Is it possible to turn off predictive text for a TextField

I would like to turn off predictive text/autocorrect for a TextField in SwiftUI. Looks like this was possible in with UITextField:
Disable UITextField Predictive Text
I checked the Apple documentation for TextField and googled, but can't find anything about this.
Has anyone found a way to disable the predictive text/autocomplete for a TextField?
Thank you!
Seems like it is now possible using Xcode 11 Beta 5. There is a new modifier to disable the autocorrection on TextField
func disableAutocorrection(_ disable: Bool?) -> some View
https://developer.apple.com/documentation/swiftui/textfield/3367734-disableautocorrection?changes=latest_beta
Edit:
Modifier disableAutocorrection is deprecated in iOS 16.1. The new modifier is autocorrectionDisabled:
func autocorrectionDisabled(_ disable: Bool = true) -> some View
https://developer.apple.com/documentation/swiftui/presentedwindowcontent/autocorrectiondisabled(_:)?changes=latest_beta&language=_5
This should work:
.disableAutocorrection(true)
Turns out you need to set the keyboard type to .alphabet for .disableAutocorrection(true) to work.
here is the extension I use:
extension View {
func removePredictiveSuggestions() -> some View {
self.keyboardType(.alphabet)
.disableAutocorrection(true)
}
}
Xcode 12.3 Swift 5.3
If you need to disable autocorrection on multiple TextFields, or indeed add other modifiers, then create a custom TextField:
struct TextFieldCustom: View {
let title: String
let text: Binding<String>
init(_ title: String, text: Binding<String>) {
self.title = title
self.text = text
}
var body: some View {
TextField(title, text: text)
.disableAutocorrection(true)
// add any other modifiers that you want
}
}
Example Usage:
Form {
Section(header: Text("Details")) {
TextFieldCustom("Field1", text: $field1)
TextFieldCustom("Feild2", text: $field2)
TextFieldCustom("Field3", text: $field3)
}
}
For the iOS 16.2 SDK, I needed to do this:
.keyboardType(.alphabet)
.textContentType(.oneTimeCode)
.autocorrectionDisabled(true)
(oneTimePasscode is an old UIKit hack to achieve the same result. It feels dirty to me, and I wouldn't be surprised if this behaviour changes again in the future...)

Saving Screenshot of the web page that has Cesium

I'm trying to add a button to my interface that will download a screenshot taken of the web page.
It works for the side bar but my Cesium map appears plain white.
Can someone help me out with is?
Here is a code
var Capture = function() {
html2canvas(document.body, {
onrendered: function (canvas) {
var tempcanvas=document.createElement('canvas');
tempcanvas.width=1050;
tempcanvas.height=1050;
var context=tempcanvas.getContext('2d');
context.drawImage(canvas,5,5);
var link=document.createElement("a");
link.href=tempcanvas.toDataURL('image/jpg'); //function blocks CORS
link.download = 'screenshot.jpg';
link.click();
}
});
}
This was based on the question asked here
So the answer turned out to be by using scene.canvas.
I was directed to this solution by a similar question on the Cesium Forum.

Why pincolor property is giving me an error with ti.map?

I am trying to include an annotation on ti.maps module on Titanium sdk 5.1.1.GA, but I am getting this error:
message = "+[MKPinAnnotationView redPinColor]: unrecognized selector sent to class 0x10c2bb4e0";
has iOS updated MKPinAnnotationView ?, because it worked fine a couple days ago, and I took exactly the same code as in the official docs http://docs.appcelerator.com/platform/latest/#!/api/Modules.Map
So the code I am running is :
var Map = require('ti.map');
var win = Titanium.UI.createWindow();
var mountainView = Map.createAnnotation({
latitude:37.390749,
longitude:-122.081651,
title:"Appcelerator Headquarters",
subtitle:'Mountain View, CA',
pincolor:Map.ANNOTATION_RED,
myid:1 // Custom property to uniquely identify this annotation.
});
var mapview = Map.createView({
mapType: Map.NORMAL_TYPE,
region: {latitude:33.74511, longitude:-84.38993,
latitudeDelta:0.01, longitudeDelta:0.01},
animate:true,
regionFit:true,
userLocation:true,
annotations:[mountainView]
});
var circle = Map.createCircle({
center: { latitude: 33.74511, longitude: -84.38993 },
radius: 1000, //1km
fillColor: "#20FF0000"
});
mapview.addCircle(circle);
win.add(mapview);
// Handle click events on any annotations on this map.
mapview.addEventListener('click', function(evt) {
Ti.API.info("Clicked " + evt.clicksource + " on " + evt.latitude + "," + evt.longitude);
});
win.open();
Does anyone has the same problem?
EDIT:
I think I found the problem, correct me if I am wrong it seems to be Titanium map module will be only supported with iOS SDK 9?, according with these changes : https://github.com/appcelerator-modules/ti.map/pull/127/files
If you're using TiSDK 5.1.# or higher, you should compile with Xcode 7. It might be that certain features are also iOS 9+, but should not fail to compile
I notice in the Apple Docs the pincolor feature has also changed in iOS 9, so it could be your map module is not yet up-to-date, or the map module has not been fitted with the latest iOS change, but I think that not to be true.
Update your ti.map module to the latest! You can find it here: http://gitt.io/component/ti.map

Sencha Touch - switching between views

i am trying to make the same app with the miamicode, i am at step 3
http://miamicoder.com/2012/how-to-create-a-sencha-touch-2-app-part-3/
i try to make the button that goes to new note (switch to a new screen and create a new note)
the code at the example is this:
onNewNoteCommand: function () {
console.log("onNewNoteCommand");
var now = new Date();
var noteId = (now.getTime()).toString() + (this.getRandomInt(0, 100)).toString();
var newNote = Ext.create("NotesApp.model.Note", {
id: noteId,
dateCreated: now,
title: "",
narrative: ""
});
this.activateNoteEditor(newNote);
}
the activateNotesList function is this :
activateNotesList: function () {
Ext.Viewport.animateActiveItem(this.getNotesListView(), this.slideRightTransition);
on my own example i try just to go the editview without passing data.
so i try this:
onNewNoteCommand:function()
{
var noteEditor = this.getNoteEditor();
// Ext.Viewport.add(noteEditor); also tried this.
Ext.Viewport.setActiveItem(noteEditor);
that code runs with no errors but the screen doesn't change.
any suggestion? whats the difference on add ?
how do i set the viewport (haven't created any custom viewport) to card? is this the problem that setactiveitem doesn't work? any other way to switch between views?
Are there some errors in google chrome browser's console? Ctrl+Shift+J to open.
Also you have to check if noteEditor equals Object or Number.
From sencha docs: setActiveItem( Object/Number activeItem )

How to create a functioning small thumbnail with small play button with Spotify Apps API?

somewhat of a javascript novice here.
I'm trying to create this: http://i.imgur.com/LXFzy.png from the Spotify UI Guidelines.
Basically a 64x64 album cover with an appropriate sized play button.
This is what I have so far:
function DataSource(playlist) {
this.count = function() {
return playlist.length;
}
// make node with cover, trackname, artistname
this.makeNode = function(track_num) {
var t = playlist.data.getTrack(track_num);
// console.log(t);
var li = new dom.Element('li');
//generate cover image with play/pause button
var track = m.Track.fromURI(t.uri, function(a) {
var trackPlayer = new v.Player();
trackPlayer.track;
trackPlayer.context = a;
dom.inject(trackPlayer.node, li, 'top')
});
//track name
var trackName = new dom.Element('p', {
className: 'track',
text: t.name
});
//artist name
var artistName = new dom.Element('p', {
className: 'artist',
text: t.artists[0].name
});
dom.adopt(li, trackName, artistName);
return li;
}
}
This datasource function feeds into a pager function later in the code. This code generates image, artist name and track name just fine except I can't seem to get the image to be 64x64 without overriding with my own css. I'm sure there is a way to set this in javascript since the core Spotify CSS files include a class for it however I'm at a loss at how to do it.
Also the play button renders but gives an error in the console that the track has no method 'get' when I click on it. How am I suppose to know it needs a get? Is there some way I can see this player function so I know what I'm doing wrong with it?
Any help would be greatly appreciated, I'm sure it'll help droves of people too as there is no documentation anywhere I can find on how to do this.
Check the code here: https://github.com/ptrwtts/kitchensink/blob/master/js/player.js
The kitchensink app displays a lot of the Spotify Apps API functionality
For the playback button, I know that it doesn't seem to actually work for single tracks used as the context. It really only works if you use either an Artist, Album, or Playlist context. Not sure why that is.