Posts Tagged ‘ipod touch’

Iphone Emulator for Windows

September 5, 2009

While I am on the topic of iPhone (and iPod Touch) web development, if you use Windows then iBBDemo is a very capable emulator that you can use to test your iPhone and iPod Touch web apps.

ibbdemo

Of course you can also install Safari on your Windows machine as well, but iBBDemo is great for capturing screen casts that have the look and feel of an iPhone.

Advertisements

More fun with iUI

August 7, 2009

I’ve been working (when the mood takes me) on an iphone/iPod Touch based web app using Joe Hewitt’s iUI framework. While the iUI famework makes a good starting point it does not do everything you might need. Take menu screens for instance, the stock menu screen looks something like this:

stock_iUI_Menu

The emulator cut the right chevrons off from the links but they are there.

This type of menu is created using a simple unordered list like this:

<ul id="First" title="First Choice">
       <li><a href="#FC1">First Choice Option 1</a></li>
      <li><a href="#FC2">First Choice Option 2</a></li>
</ul>

One thing I wanted to do was to be able to include additional markup such as headings, paragraphs or even images say, into the menu like this (multiple sub menus with a heading before each):

iUI_Menu_Option1

This is the markup I used to create the screen above:

<div id="Second" title="Second Choice">
      <h3 align="center">Make a choice from here</h3>
      <div class="CustomLinks">
           <a href="#SC1">Second Choice Option 1</a>
          <a href="#SC2">Second Choice Option 2</a>
          <a href="#SC3">Second Choice Option 3</a>
          <a href="#SC4">Second Choice Option 4</a>
     </div>
     <h3 align="center">Or make a choice from here</h3>
     <div class="CustomLinks">
          <a href="#SC1">Second Choice Option 1</a>
          <a href="#SC2">Second Choice Option 2</a>
          <a href="#SC3">Second Choice Option 3</a>
          <a href="#SC4">Second Choice Option 4</a>
     </div>
     <hr/>
</div>

Notice that the panel is defined with a DIV instead of a UL tag and that the sub menus are themselves DIVs with a class of “CustomLinks”. More about this later.

A variation on this style that I wanted is shown here:

iUI_Menu_Option2

The difference, if it is not obvious, is that the sub menus are now in their own little panels. The markup for this looks like this:

<div id="Third" title="Third Choice" class="panel">
     <h3 align="center">Make a choice from here</h3>
     <fieldset>
          <div class="CustomLinks">
               <a href="#TC1">Third Choice Option 1</a>
               <a href="#TC2">Third Choice Option 2</a>
               <a href="#TC3">Third Choice Option 3</a>
               <a href="#TC4">Third Choice Option 4</a>
          </div>
     </fieldset>
     <h3 align="center">Or make a choice from here</h3>
     <fieldset>
          <div class="CustomLinks">
               <a href="#TC1">Third Choice Option 1</a>
               <a href="#TC2">Third Choice Option 2</a>
               <a href="#TC3">Third Choice Option 3</a>
               <a href="#TC4">Third Choice Option 4</a>
          </div>
     </fieldset>
     <hr/>
</div>

The only difference is that I’ve added the standard iUI class=”panel” attribute to the outer DIV and I’ve wrapped the sub menu DIVs with the standard iUI fieldset tag.

Both of these menu variations still work exactly the same as the original iUI unordered list style menu but they offer the ability to give the user some additional information as well as to group menu items together on the same main menu panel. Anyway I think they look good!

So, what’s the secret ingredient, some custom CSS of course so here it is:

.CustomLinks {
     position: relative;
     margin: 0;
     padding: 8px 0 8px 10px;
     font-size: 20px;
     font-weight: bold;
     list-style: none;
     }

.CustomLinks > a {
     border-bottom: 1px solid #E0E0E0;
     display: block;
     padding: 8px 32px 8px 10px;
     margin: 0 0px 0 -10px;
     text-decoration: none;
     color: inherit;
     text-align: left;
     background: url(iui/listArrow.png) no-repeat right center;
     }

.CustomLinks > a:first-child {
     top: 0;
     border-top: 1px solid #E0E0E0;
     text-align: left;
     }

I placed this in a stand alone css file in the same directory as my web pages and referred to it in the initial page header just as you would for any other css file. The web directory had iui as a child directory, hence the location of listArrow.png as being in the iui sub directory. You could add this css to the original iui.css file in which case you’d need to remove the reference to the iui sub directory from that url, otherwise everything can remain the same.

<div id=”Second” title=”Second Choice”>

<h3 align=”center”>Make a choice from here</h3>

<div class=”iMegLinks”>

<a href=”#SC1″>Second Choice Option 1</a>

<a href=”#SC2″>Second Choice Option 2</a>

<a href=”#SC3″>Second Choice Option 3</a>

<a href=”#SC4″>Second Choice Option 4</a>

</div>

<h3 align=”center”>Or make a choice from here</h3>

<div class=”iMegLinks”>

<a href=”#SC1″>Second Choice Option 1</a>

<a href=”#SC2″>Second Choice Option 2</a>

<a href=”#SC3″>Second Choice Option 3</a>

<a href=”#SC4″>Second Choice Option 4</a>

</div>

<p align=”center”>Dave Ellis Rocks!</p>

<hr/>

</div>

More on Connecting the iPod to Windows

May 14, 2009

About a million years ago (actually 2005) I wrote a visual basic application. Yeah, I know, who uses VB these days but I have the VB6 product and some books and I can just about write windows apps in vb so it works for me (and it’s cheap since I already have everything and I’m nothing if not cheap, ask my wife!).

So what I am trying to do is to control that app from my iPod hence the earlier post about using vnc to get to the desktop.

Since then I have discovered ‘web apps’ for the iPod and some wonderful component called iUI that makes it pretty easy to make web pages look like native iPod and iPhone applications.

So now I am looking at how to embed a web server into my vb application so that it can be controlled from the iPod. It does not have to be very fancy either, or even multi threaded. Unfortunately all the commercial plug in controls that I have found as way too expensive so looks like I am going to have to make my own. I’ve found a couple of simple examples I might be able to use and I’ve done similar stuff before on other platforms so it should not be too hard.

Windows Desktop on an iPod Touch (or iPhone)

May 12, 2009

Some things are a triumph of technology over common sense and this is definitely in that class, although I do have an ulterior motive that I’ll write about in a later post.

It’s actually remarkably easy to do. First, go to www.realvnc.com and download the free VNC server and install it on your windows box and configure it. For my initial testing I have not got any security but it’s all behind my firewall and on a separate laptop so it’s all pretty secure anyway.

Then go to the Ipod App store and install Mocha VNC Lite. The lite version is free. You can read about it here http://www.mochasoft.dk/iphone_vnc.htm

Enter the IP address of you windows machine into mocha and hit connect and if you are lucky, you will see your windows desktop on you iPod screen.

You may have to tweak your firewall settings (if you have a firewall setup on your windows box) to let Mocha connect to to the windows machine but other than that it was all pretty straight forward.

Usability is not great and I cannot reduce the screen resolution on my laptop without the fonts going all screwy but I suspect it will be enough for my needs at this point. You can at least grow the desktop in the same way that you can with a web page on the iPod to make it more readable although you then end up having to scroll around the screen to see it all but like I said, I think this will be enough for my needs right now.

Here’s the beastie in action!

WindowsOnIpod

Cool huh!

Easy come, easy go. 2

May 11, 2009

The Archos is gone. Kudos to Wolf camera, they refunded not only the purchase price of the unit itself but also the cost of the additional base unit that we’d bought and part of the cost of the extended warranty as well.

We have a friend who has an Archos but it has the hard drive, not the solid state drive and he loves it and I’m sorry, we really did try to make the thing work for us but in the end it was just too unreliable.

So after returning that, my wife went upstairs in the mall to the Apple shop and bought an iPod touch instead.

How to waste two days

May 10, 2009

Ever since I got my iPod touch I have wanted to try doing some programming for it but you need a mac to do that as the development kit only works on a mac. Well I’m not about to pay apples stupid prices (yet) just to ‘try’ something so I decided to try to build a ‘hackintosh’ which is basically a normal PC with a hacked version of the mac OS X on it.

I had an old PC with an AMD CPU in it so step one was to get a version of the OS that would run on an AMD chip. I found a site called rapidshare which, despite the name is anything but. Well, you can pay four and a half Euros for a 3 day membership to get premium service but otherwise you can only download one file every 15 minutes or so and the download speed is sloooooooooow!

Nevertheless, after a day or so I had all the files I needed which I was able to combine into the necessary dvd iso image.

So next I had to burn the image to a DVD. Unfortunately my very old computer came with very old burning software and after three tries I still had not managed to make a bootable dvd. Then I found out about a command line utility from microsoft called burndvd. Downloaded that and hey presto, one bootable cd. Another few hours wasted.

In the meantime I discovered that my old PC only had a CD drive, not a DVD drive. Waste another couple of hours swapping out the drive for an old DVD drive I had lying around (being a hoarder pays off sometimes!).

Finally, I get to try to install the mac os. Get kernel panic almost right away!. Mmmmm, not good. some research reveals that the cpu must support something called SSE2. Went off and downloaded cpuid and wasted another couple of hours trying to get it onto the old PC because it’s not on my network before I found the kid had some CD’s lying around so I burnt it to one of those to get it only the PC.

Finally I ran it and discovered that my chip (a Socket A chip) does not have SSE2 so after ALL that, my hacked up hackintosh was never going to work.

I could go (to tigerdirect aka compusa these days) and buy an el cheapo pc for a couple of hundred bucks and try it on that but if it does not work, all I have is a PC I don’t really need.

Alternatively I could bite the bullet and buy a ruddy mac mini but that’s going to put me back $600 or so and it’s still just another computer that I don’t really need. Remember I am just doing this to ‘try’ this stuff out at this point and $600+ is an expensive way to ‘try’ something. Plus there’s other stuff I’d rather spend my money on right now!

I cannot even go and just buy an older mac because the iPod dev kit requires an intel based mac which limits me to pretty much the current crop of (expensive) macs.

 

So the search continues for a cheap way to try a mac

 

What really gets me is that when Microsoft (or anyone else for that matter) tries to ‘lock you in’ to their product set everyone complains but when Apple do it, it seems to be fine. So much for consumer protection.

Blogging from iPod touch

March 1, 2009

My very first blog post from my iPod touch. One finger typing is hard though, especially with my big fat fingers. OK for doing short posts though.