Apple watch not showing any images - ios

we are having problems with image not showing up on the apple watch, we tried the following :
Our image is located in the apple watchkit extension, and we tried to put it in the cache:
let img = UIImage(named:"slider_r.png")
WKInterfaceDevice().addCachedImage(img!, name:"slider_r.png")
It crashed immediately...
Then we tried to add the image directly on the apple watchkit app: no assets.
No image loaded up...
Then we tried putting it in an image.assets didn't work either...
We are currently out of ideas...
Thanks !

Alright, I've been working with WatchKit for about a month now - here's what I know:
Placing your image into the Watch App's Assets Catalog will add it to the Watch's bundle. This will be immediately available for use using UIImage's .setImageNamed("name").
Placing your image into the Watch Extension's Assets Catalog will add it to the extension's bundle, residing on the phone. Now, to get that to the watch you have to first grab a reference to the image from the extension, then add it to the device's cache, using WKInterfaceDevice().addCachedImage(image, name:).
Check out the Apple documentation for providing images to the Watch here. Here's the documentation for setImage(_ image: UIImage?):
This method changes the image being displayed. Use this method to send images from your WatchKit extension to the WatchKit app. The image interface object is resized to accommodate the size of the newly specified image. If the image itself is too large for the device’s screen, the image is clipped.
This is not what you want. You want to explicitly add the image to the cache so you can use it later. If you use setImage as described above, it will transfer the image from the phone to the watch every time you call it, which is not ideal if you're using the same image in multiple locations or you're using it very frequently. You have to be careful in choosing exactly which images you want to cache on the watch.
Using what we now know:
var img: UIImage = UIImage(named: "slider_r") // grabs the image from extension's bundle
WKInterfaceDevice().addCachedImage(img!, named: "slider_r") // adds to the Watch cache
myImageOutlet.setImageNamed("slider_r") // grabs the image from the Watch cache
Ensure that the asset catalog is included in the extension's target so that the images are correctly placed in the bundle at runtime.
You do not need to include the extension (e.g. ".png") in the image's name.

Related

Not getting stored UIImage from WatchApp Target

I have added images in image assets in watchApp target and now I am trying to Load an array with these images. But every time I am getting image as nil.
ex. added A1.png, A2.png, A3.png......in image asset in watchApp target.
Now, trying to get image with image name as...
UIImage *img = [UIImage imageNamed:#"A1"];
But, every time I am getting nil.
Issue is that you have added the images in your WatchApp target and trying to load the image through an API which will search the images in your WatchExtention bundle. To understand this we need to see how images are being searched in bundles for WatchApp and WatchExtention.
Let's take an example that we have an object of WKInterfaceImage say objImage.
WKInterfaceImage *objImage;
When you use the method [objImage setImageNamed:#"abc"], system send the name of image to WatchApp and search for the image in WatchApp bundle not in the Extention bundle.
However when you specify your images in Extention target(bundle) then to use these images they need to be transferred to WatchApp target using imageNamed: method, which will search the image in Extention bundle not in WatchApp bundle.
So if you want to use the imageNamed: API, you need to specify your images in Extention target as well. However this has some overhead of it's own and i suggest not to use unless necessary.
Check the Apple Documentation:Section - Using Named Images to Improve Performance for detailed reference.

How To Load The Image Set(The Bundle) From Images.xcasset in iOS

When I am developing apps in iOS before, I always put the image sources of the app at the root directory of the project, and then I will load them using [UIImage imageNamed:#"image.png"]. I did't even include various sizes and resolutions such as image#2x or image#3x. But I am afraid this is not a good practice, because I cannot deal with different screen resolutions.
Now, I want to make use of the Images.xcasset to store all my image sources so that I will be able to load just the bundle name, and hoping that the system will pick the image with the right resolution automatically. Therefore, I made a test and place my image set under Images.xcasset and named it as images, and then in my UIViewController.m I am trying to load the image by calling [UIImage imageName:images]. As a result, it didn't work. So I searched for an answer and found out that I should call [UIImage imageName:#"images60x60#2x.png"] in order to load the the 60pt #2x image.
But I think this still did not solve my problem, because I am still choosing which image to load. Is there a way to load the entire image set or load the image according to the resolution of the screen?
Please help. Many Thanks.
EDIT: Added Screen Shots
I use AppIcon as a test
As you said at last that you are using AppIcon as a test. Please don't AppIcon it is made for internal use. try to create you own imageSet and use that. It should work.
Two things :
As said Ankit, do not use App Icon, use your own set
do not use a file suffix. Just reference [UIImage imageName:#"MyImage"] (not [UIImage imageName:#"MyImage.png"])

What name should i give for a ipad background image

Im creating a universal app. in my login page i am having a background image i named it as LoginBG#2x and LoginBG#3x for iphone-4,5 and iphone-6 respectively. So, what name should i give for the ipad version images so that iOS will automatically pick them up when my app is viewed in iPad
Use Image Asset Catalogs instead.
It manages image according to device.
You can drag and drop images in respective position -
For more information read - Asset Catalogs
You can give the name as :
file~ipad.png
file#2x~ipad.png
Or batter you can use the assets catalog
Yo can give name like easily you can remember.
like
abc.png
abc_ipad.png

Programatically Set UIImage Animation with WatchKit

I can't seem to figure out how to programmatically set a new image, via the outlet, and make it start animating.
Sequence
zeroEntering0.png
zeroEntering1.png
zeroEntering2.png
zeroEntering3.png
zeroEntering4.png
I imported the sequence of images into the Image.xcassets inside the WatchKit App
I can set the image in the interface builder to "zeroEntering" and set animating to "Yes" and it works correctly.
However, I want something more dynamic, I need a button press to choose a new animation sequence and start it off. If I try and set the image programmatically using the same name from the interface builder, the UIImage is nil.
What naming convention should I use when programmatically setting the UIImage? "zeroEntering", "zeroEntering0", "zeroEntering.png" or "zeroEntering0.png"
I tried using the two non-nil options and the image did not animate and went black.
The answer is subtle and definitely got my wheels spinning for too long.
According to this beautiful article,
You should use setImageNamed(:) when the image you want to display is either cached on the watch on is in an asset catalog in the watch app’s bundle, and use setImage(:) when the image isn’t cached — this will transfer the image data to the Apple Watch over the air!
So, I kept my images in the assets catalog on the watch app, and switch to use,
[self.testImage setImageNamed:#"zeroEntering"];
[self.testImage startAnimatingWithImagesInRange:NSMakeRange(0, 4) duration:0.2 repeatCount:100];
Set the image as [UIImage imageNamed:#"entering"] then call startAnimatingWithImagesInRange:duration:repeatCount:
Check it out here: https://developer.apple.com/library/prerelease/ios/documentation/WatchKit/Reference/WKInterfaceImage_class/#//apple_ref/occ/instm/WKInterfaceImage/startAnimatingWithImagesInRange:duration:repeatCount:
Make sure to follow the tips here: https://developer.apple.com/watchkit/tips/

Image loading into UIView

I'm loading an image into my UIView background as a background color from a file stored in my xcode project. It works fine on the iPhone simulator but when I compile on my iPhone, the image isn't there in the background, which is obviously due to the fact that the image isn't stored as a file on phone. Is there a way to hard code an image so it's transported to different devices, forgoing the need to have an image file present?
When dragging a image(or any other reseources), be sure to check this option: Copy items into destination group's folder. In this way, your image will be store in the app bundle, instead to just reference from some path inside your pc.
Here's of this checkbox:
Have you tried
adding the image to the bundle in the copy files build phase?
This will put the image into your app so it will always be there.
Image load important point:
1.Make sure your image below your project document, the true path or relative path.
2.Image name differentiate uppercase and lowercase on the iphone but not use the iphone simulator.
3.Use Xcode shotcuts 'command+shift+K' to clear your project then run again, judge for if the image cached or not.
Run run run!
Happened to me once as well. Remember that if you're using [UIImage imageNamed:#"imageName"];, then with the iOS simulator, you don't need the letters to be in the right case. If your image is named "IMAge.png", then the simulator would find it with the parameter "image.png", but the device wouldn't. So make sure you've got the correct name, the device is case-sensitive.

Resources