There’s been a lot of confusion about how the iPad VGA Adapter works. I received mine today, and I thought I’d try to clear things up a little (and give you some code to play with, if you’re an iPad developer with a VGA adapter of your own).
The first thing to understand is that the adapter does not mirror your iPad screen. You can’t plug your iPad into your TV or monitor and see all your apps on the big screen, like Steve Jobs does when he’s giving a demo.
Apps that want to support external display via the adapter must explicitly do so; the developer has to write code to support it. There are some standard iPhone OS-supplied APIs which will automatically do the right thing (such as video playback via standard controllers), but generally you won’t see anything on your external display unless the app you’re using has taken steps to put something there. That’s the “bad” (though surely not surprising) news.
The good news is that it’s trivially easy to support external display from your app if you’re a developer; the connected display just shows up as another UIScreen object. I made a sample project (which you can download as a zip archive here) that shows how to do it.
It’s basically just a nib with two windows (one for showing on the iPad, and one for showing on the connected external display), and a tiny bit of code to make it work. When you run it on an iPad with the VGA adapter connected and attached to an external display, you’ll see something a lot like this:
What you’ll see if you run the code on an iPad with the adapter connected.
Note that “VGA” is a bit of a misnomer here, since as you can see the actual output resolution depends on which modes the connected display supports. My code allows you to pick which one to use. Don’t even bother trying to run the code in the Simulator or on an iPad without a VGA adapter connected and attached to a monitor, TV or projector. It’ll be an extremely boring experience if you do. Update: As of the 4.0 SDK, you can now simulate a connected external screen in the iPhone/iPad Simulator, at any of the supported resolutions.
Once again, you can download the source code here.
Hope it comes in handy, and I look forward to seeing the interesting ways you support external displays in your iPad apps!
Actually, I just tried, and it works great on the Simulator.
What’s your configuration, Joel? I have a MacBook with an external monitor, and no matter which one I put the menu bar on and which one I put the simulator on, the app never sees an external screen. On the iPad it’s a dream, but frustrating not to be able to debug. But thanks for the code, Matt!
Joel, (just like Eric’s question below) can you explain how you did this, I have a MacBook Pro, with external VGA adapter to an external monitor… but no matter what I do I cannot get the sample app to “see” the external monitor. Just curious, for debugging this would make it easier to develop with.
[...] This post was mentioned on Twitter by Matt Legend Gemmell and Josh Johnson, Archana Patchirajan. Archana Patchirajan said: Source code showing how to support external VGA/projector/etc output from iPad: http://tinyurl.com/3x6pemz (via @mattgemmell) [...]
do you know if pages (the word processor on the ipad) supports an external monitor?
tia
[...] his blog, developer Matt Gemmell reminds readers of the confusion. It’s not like Steve Jobs’ keynotes where the entire iPad screen is shown on the [...]
[...] Gemmell (author various open source libraries, including Twitter engine used in Twitterrific) on iPad VGA output. Tagged as: dock, howto, ipad, Software Development No Comments Benchmarking the iPad » [...]
how to use this source code? thanks
[...] iPad VGA Output » Matt Legend Gemmell There’s been a lot of confusion about how the iPad VGA Adapter works. I received mine today, and I thought I’d try to clear things up a little (and give you some code to play with, if you’re an iPad developer with a VGA adapter of your own). (tags: content tutorial ipad vga) [...]
Teachers and other education professionals are very interested in iPad VGA output. Maybe someday Apple enables it in the OS for every user to switch on or off. But that’s Apple you never know.
Clever app developers should have a look at the education market and develop apps specially tailored to what teachers need.
The iPad could be a cheap substitute for interactive whiteboards.
Thanks Matt for sharing. Perhaps some developers will jump to it and create amazing apps for educational use.
[...] App, das unter anderem auch Mindmapping über VGA Output erlaubt, ist Zetopad Planner Note. Für den schulischen Einsatz scheint es mir weniger geeignet und es ist mit 40 € auch [...]
Hey Matt,
I’ve been wanting to do this since I got my iPad! This is great.
My question is how do you mirror what you see on the iPad?
I see you have 2 windows set up inside your nib. How do I set it up so that the external window shows what the device window does?
As I mentioned, there’s no automatic mirroring, so to perform display mirroring you’ll have to do it yourself – i.e. ensure that any drawing/updates which occur on the internal screen are explicitly duplicated on the external one.
Hi there your code is very useful. however, could u explain how to make the mirror???
and how to make sure the output of the ipad is landscape?
thanks mike
Hi Matt,
Thanks for the post!
What about iOS 4? Do you know if it also supports multiple UIScreens? I’d like to play back video to the TV-Out cable.
Best,
Martijn
iOS4 does support the adapter; it will work with the iPhone.
Hi,
Could i have a monitor and iPad keyboard dock which, when the iPad is docked allows me to use the iPad but on a larger screen. Trying to replace my computer with an iPad!?
i realise it wouldn’t be touch screen but perhaps a mouse could be incorperated?
As mentioned, there’s no system-wide display-mirroring.
Thank you to sharing this. It is very nice.
[...] iPad VGA Output is another snippet from same showing how to handle a VGA adapter connected external monitor. [...]
Wow…thanks so much…at least I know the £25 cable I bought works…I hope I can figure how to incorporate this in my apps, want to try some simple VJ stuff….thanks again
TV out is now available from the hardware menu of the iphone simulator for those like me that hadn’t found it!
Matt – you quote “iOS4 does support the adapter; it will work with the iPhone”. I have an iPhone 3GS with IOS4 but when I plug the iPhone into a projector or TV using the Apple Cable, it does not recognise the output device using the above application … Does it only work with an iPhone 4 or can you get it to work with a 3GS .. If you know how, can you send me a link to some source code that will help me please….
This is a great bit of code, however when I try to use it I cannot show the contents of my navigation controller in the second (external) window. How do I copy (mirror) the contents of one window to the other? Any ideas?
Thanks for the info. We will add support for this to our QBook apps which are already being used in the schools. This will really make it easier for teachers to use apps in the classroom.