Browsing the Apple category

NativeScript installation error

I was getting an error trying to install NativeScript (on my Mac).  Here’s (part of) the error I got:

TypeError: Object function Object() { [native code] } has no method ‘assign’ at Object.<anonymous> (/usr/local/lib/node_modules/npm/lib/config/cmd-list.js:113:33)

 

The solution: I thought I had the right version of Node installed; but I didn’t.  Even after doing “brew update”.  I manually re-installed Node (going to the official site) to make sure I had the latest version; then I was able to run npm correctly.

Read the article

Image upload from iPhone/iPad rotates 90 degrees

One of my latest projects dealt with image manipulation, and I had a real struggle coming to the final version of the code.
The size of an image (in MB/KB) is partially dependent on the size of the image (pixels).  If you have two images of the same content with one being 3000px x 3000px – and the other is 50px x 50px – then chances are the smaller one (in pixels) will load faster.  This is especially important for users on a mobile device, as they may be on a slower connection.
This is why many sites – including FaceBook, store multiple-sized images (of the same thing). They’ll store the “original” and a “thumbnail” (and various sizes of the thumbnail).  When a user needs to view a “lot” of pictures, the thumbnails will be shown (which are faster); and then the user clicks on one, they can see the larger picture (which will take longer to load).  The larger picture is not loaded automatically, in an effort to save download time.
So for my app, I needed to store multiple sizes of the same picture.  But taking this a step further: what if, when the user sends (uploads) the file to the server, it was already in a reduced size, thus making the app load faster? I began looking into JavaScript solutions.  Note: it is possible to load the “original” image to the server, and use a server-side language to create multiple-sized thumbnails.  And I do do this; but I wanted to avoid it for the initial file upload.
So I needed to take the contents of a “file input” and put it onto the screen (visible, or not) – perhaps in an IMG tag or a CANVAS.  Then I had to resize the image (make it smaller in pixels >> smaller in file size >> faster to upload).  But I had to figure out how to get it from an HTML component (not the “file” input type) to the server.  To do this, you have to convert the image/canvas to a Blob.  Note: on the server side, I had a validation check for “the file that the user is trying to upload: is it of a certain data type?”  But when it’s converted to a Blob, there is no file extension!  So that caused some of my server-side checks to fail…
Anyways, this was all working, except that Apple has a “feature” in that they can (inaccurately) detect the orientation of the image.  Basically when you upload an image from an iPhone/iPad, it will rotate it 90 degrees! I didn’t want to have to come up with code to detect the operating system the user is on, and deal with it that way; rather, I wanted to find out from the image itself.
Turns out there is a concept of EXIF that stores extra data related to the image (ex. the location where it was taken).  And Apple likes to put in a value in the orientation that messes things up.
I tried everything to find the solution for “iPhone rotates image when uploaded” – but couldn’t find a client-side (JavaScript) or server-side (ex. PHP) solution.  I figured that a client-side solution would be easier to implement, so I began my search.
I tried to find a JavaScript library to help; I came across these two, but couldn’t get it to work:
https://github.com/exif-js/exif-js (specifically, with this one, I ran into the error of  “Uncaught TypeError: Cannot read property ‘getData’ of undefined”).
So I ended up finding a separate function that could get me the orientation:
And rotating the picture from there (only if needed) – and then uploading the contents of the FORM with JavaScript’s “FormData”.

Read the article

Apple App Store Rejection: iPhone resolution doesn’t run on iPad

My app was rejected from the Apple App Store with the following reason:

We also noticed that your app did not run at iPhone resolution when reviewed on iPad running iOS 10.3.1. Specifically, your app is not optimized for iPad.

They included a picture, but it wasn’t much help.  It wasn’t until that I viewed my app on the iPad 12.9″ screen simulator did I notice that the images were a little blurry.

My app is comprised of a website being displayed in an app “shell.”  With the retina screens, images will appear blurry if not resized correctly.  Ideally you’d upload 2 versions of a picture; the regular and then one of higher quality.  My app is based on users uploading pictures, so I decided to cut the image in half.

The solution: have a CSS media query that, if the device is using a Retina display, resize it to 1/2 of the image width (not specifying a height will make it proportional).

 

@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
img {
width:50%;
}
}

UPDATE:

I had explicitly stated a height/width for my images (as, you should), but that didn’t help – some were still blurry.  In some cases I removed the height/width (leaving the Bootstrap “responsive” class intact), and for my logo, I was able to use CSS tricks instead of an image.

Read the article

apple upload error -22421

Not sure what caused this error, but when I tried uploading to the App Store a second time (making no changes), it just worked.

So just try again!

Read the article

device for apple watch isn’t registered on developer portal

I have an Apple Watch.  When developing an iOS app, and my iPhone is plugged in, I’m prompted to register my watch in the developer portal –  even though I’m not making an iOS watch app.  Pretty annoying.  When my iPad is plugged in, I’m not prompted.

The solution, from this link (that I had to sign up to view the contents)

1 – Turn off Bluetooth (Under “Settings”)

2 – In XCode, ensure the device is explicitly set for “iPhone” (as opposed to “Universal”).  Although afterwards, I was able to change it back to Universal…

Read the article

Swift ios webview not working

I had “old” code for Swift that displayed a webpage, but a year later it wasn’t working.

The solution: use this instead:

webView.loadRequest(URLRequest(url: URL(string: “https://google.com”)!))

Read the article

apple missing ios distribution signing identity

I feel like every time I make a new iOS app, Apple does something to mess with me.

The latest issue was, upon completion and trying to “archive” the app in preperation for the App Store, I get the error: “apple missing ios distribution signing identity”

Apparently it’s a known issue; check out Apple’s Developer site .  Under “known issues” – the first one for XCode:

– Keychain Access >> “System Keychain”.  In the “View” menu, select “Show Expired Certificates”.  Delete the one that’s expired (I guess they all expired on Feb 14, 20146?).  Then there’s a link to download (just double click) the “renewed certificate”.

Read the article

swift webview disable bounce effect

I wanted to disable the “bounce effect” from my Swift-based Web App. After more searching than I should have done, the solution was:

webView.scrollView.bounces = false

 

UPDATE: I originally had this:
webView.scrollView.scrollEnabled = false

… which disabled scrolling completely

Read the article

Webview using Swift with Progress Indicator – Tutorial

I needed a simple iOS app that loaded a webpage, and had a progress bar. I’ve created a basic webview in Objective-C, but wanted to use Swift.

Open XCode >> New XCode Project

(on the left) iOS >> Application … select “Single View Application” . Enter in a “Product Name” and ensure the language is Swift.  Device should be Universal.  Hit “Next” to save it.

Optional: I unchecked “landscape left/right”

01_swift_device_orientation

Go to Main.storyboard

Optional: I click on the “View Controller” (3 buttons at the top of the storyboard, the far left one).  Then in the right pane I click on the 4th icon. Under Size, I change it to “iPhone 3.5-inch” so that it fits on my screen

Drag a “Web View” onto the Storyboard, make sure it takes up the entire width.  At the bottom right in this section are 4 icons.  Click the one on the far-right.  In the menu, select “Add Missing Constraints”.

02_swift_missing_constraints

Drag an “Activity Indicator View” to the storyboard (put it in the center).  Just as with above, hit the far-right icon at the bottom and select “Add Missing Constraints”

At the top right of the window, there’s an icon with two circles (this is the “Assistant Editor”).  Click it, and a code window comes up.

03_swift_assistant_editor

Click on the Web View.  While holding “Ctrl”, click and drag it to the code window, right below class ViewController: UIViewController {  .  When you release (the mouse and the Ctrl key),  you’ll see a box come up for an “Outlet”, and you’re prompted to type a name.  Enter in “webView” and hit the Connect button.

 

Repeat for the Activity Indicator: hold Ctrl, drag it to right below the new line that was just entered in the code.  Call this Outlet “progressIndicator”

04_swift_outlet

Inside of the override func viewDidLoad(), add this code in (of course replace with your URL).

let urlString = “https://hashtagsaver.herokuapp.com/login”

self.webView.loadRequest(NSURLRequest(URL:NSURL(string: urlString)!))

Your code should now look like this:

05_swift_code_status

You can go ahead and run the code (hit the “Play” button at the top) – the webpage will load up.  Note: you have to put in an https URL due to security reasons.

Next up is to link the Activity Indicator to start, and stop/hide.

Near the top of the code, the ViewController is defined.  Add the part in bold:

class ViewController: UIViewController, UIWebViewDelegate {

In the ViewDidLoad(), add this in:

webView.delegate = self

This allows you to have extra code related to the Web View.  For example, you can detect when the page loads (and stops loading).  Use this code to animate the progress indicator.

func webViewDidStartLoad(webView: UIWebView) {
progressIndicator.startAnimating()
}

func webViewDidFinishLoad(webView: UIWebView) {
progressIndicator.stopAnimating()
}

Lastly, back in the Main.Storyboard – click on the Activity Indicator.  In the right pane, 4th icon, there’s an option to hide it when the animation stops.  Click that.

06_swift_indicator

That’s it! The completed code can be found on GitHub

Read the article

xcode activity spinner does not spin

Where my spinner is named “theSpinner” – I simply added the line in bold to make it spin:

– (void)viewDidLoad {

    [theSpinner startAnimating];

}

 

I’m using this to display a website. With the delegations set, I just hide it when the page loads:

– (void)webViewDidFinishLoad:(UIWebView *)webView {

    [theSpinner setHidden:YES];

    self->webView.hidden = NO;

}

Read the article