Alignment of small images

Hello everybody,
I have a problem while trying to align small pictures in the text.
Id like to insert small buttons in the text, as if they were text characters (see http://img25.imageshack.us/img25/4169/correctalignment.jpg )
Now the text overwrites the images or the images cover the text (see http://img25.imageshack.us/img25/6862/wrongalignment.jpg )
What can I do?
Thanks in advance
Verena

I'm not having any problem with your links, but I would do it differently. I would create a two column table with as many rows as there are buttons. In the first column place the image (with its anchored frame) and in the second column place the text. If the image is not in the middle of the sentence then this is a neat way of doing it. It also avoids the problems you have where the images are large compared with your font size.
Robin

Similar Messages

OpenGL Best Only for Small Images in CS5?

I've been using Photoshop CS5 daily from shortly after the day it was released on my Windows 7 x64 system. I have a decent dual processor dual core w/hyperthreading workstation with 8 GB of RAM and a VisionTek ATI Radeon HD 4670 video card with 1GB of onboard video RAM. Mostly I've been editing relatively small images (10 to 20 megapixels), though I've successfully made some pretty big panoramas.
Outside of a few glitches, most of which were solved with 12.0.1 (i.e., things like crashing or stuck processes after shutdown), I've had very good results with Photoshop CS5.
I tried the various OpenGL settings, and since the "Basic" setting seems to stress OpenGL the least while still providing me access to the new OpenGL features (e.g., brush gestures), I have chosen that setting. Keep in mind this decision was also influenced by the sheer number of OpenGL-related issues being reported here.
However, in the past day I have been working on a rather larger image... Not huge, as Large images go, but large enough that it has caused me some unexpected Photoshop trouble. Basically, it's a set of 7 digital camera images of 10 megapixels arranged in a 12 x 36 inch layout at 600 ppi. Overall image size is 21,600 x 7200 pixels x 16 bits/channel. The image on disk is roughly a gigabyte. Here's a small version so you can see what I'm talking about...
I had this image in 2 layers - the images with transparent surround and outer bevel layer style, and the background blue. The customer wanted the images spread out a bit more so I undertook to do so - by lassoing sets of the images and moving them apart.
Here's where the trouble began. Some of the work involved zooming in, to say 250% or closer, to check alignment and to nudge things as needed.
While working on this image I find Photoshop gets quite sluggish, though it's not hard on the disk drive.
After I moved everything into place and did File - Save, my system simply froze as the progress bar reached 1 pixel shy of a full bar. That required a hard reset of the computer. No events were logged in the Windows System or Application logs.
I redid the work, and second time I did File - Save As... the dialog never came up. Photoshop just disappeared. Again, no errors logged.
Today I ran through the edit again, this time with OpenGL turned off. I found:
1. The system was nowhere near as sluggish when displaying the image at high magnifications. I could move things around easier.
2. I was able to complete the same edits again (the 3rd time) and File - Save As... successfully.
Today I upgraded my ATI drivers to Catalyst 10.6, re-enabled OpenGL in Photoshop, and went through the same edits on the same file a 4th time.
1. Same sluggishness as before when zoomed in.
2. After moving the images around, when I went to use the Spot Healing Brush Photoshop crashed: Unhandled Exception, 0xC0000005: Access violation reading location 0x00000000007e8ebb0.
I don't have Photoshop debugging symbols, but this is what the Call Stack showed in the debugger:
I will continue to experiment with this to see if I can isolate what's causing it, but the one key thing here is that it works with OpenGL turned off, and it fails in several ways with OpenGL turned on with a powerful, relatively modern video card.
-Noel

Thanks for your responses.
I'm investigating the Normal and Advanced settings with this same image as time permits.
So far I've been able to complete the same edits and save the file successfully with OpenGL set to Normal. Notably as well Photoshop was VERY much more responsive.
It's a very small sample size, but one might be forgiven for concluding that Photoshop has had the most testing with the OpenGL setting at default. I do plan to continue testing with this image, as it seems to be a good one for stressing the system and reproducing one or more problems.
I may have been wrong in my judgment that the Basic OpenGL setting stresses the system less.
As far as why I'm working with a 16 bit image and at this high a resolution, I am specifically pushing Photoshop hard since with a 64 bit system these things should be possible, and I haven't gotten a lot of experience working on big images with 12.0.1. While this particular image does not require it (especially for a 12 x 36 print) I often DO work on 1 gigabyte or more astroimages, and I just haven't had a good big one to work on lately.
-Noel

Create Small Image From UIImagePickerController

Hi, I've spent many hours trying to get this work, it seems like such a 101 question, but I am honestly stuck here.
I've got a UIImagePickerController working, I get my reference to a UIImage and I can get it to display, so I know I have a UIImage. However, I would like to resize this image so I can display it on a small UIImageView (45x45).
I've put together come code that should work, but I am getting linking errors, So I think that I must be doing something wrong. It seems like such a simple task to resizing an image, but these link errors make me think that I should be using some other part of the iphone sdk.
Thanks for your help!
Here is my code which gives me a link error:
-- here is my code --
//NOTE: (UIImage*) playerImage is passed in to method
UIImageView *playerImageView = [self fetchPlayerButtonByIndex:scoreAppModel.currentPlayer];
//CGImageRef playerImageRef = CGImageRetain( playerImage.CGImage );
CGRect imageRect;
imageRect.origin = CGPointMake(0, 0);
imageRect.size = CGSizeMake(45.0, 45.0);
//CGColorSpaceRef
CGContextRef bitmapCtx = CGBitmapContextCreate(NULL/*data - pass NULL to let CG allocate the memory*/,
45,
45,
8 /bitsPerComponent/,
0 /*bytesPerRow - CG will calculate it for you if it's allocating the data. This might get padded out a bit for better alignment*/,
CGImageGetColorSpace( playerImageView.image.CGImage ),
//CGColorSpaceCreateWithName( kCGColorSpaceGenericRGB ),
// CGColorSpaceDeviceRGB(),
kCGBitmapByteOrder32Host|kCGImageAlphaPremultipliedFirst);
// draw the image of the player to the context
CGContextDrawImage(bitmapCtx, imageRect, playerImage.CGImage);
// create a new cg image
CGImageRef newCgImage = CGBitmapContextCreateImage(bitmapCtx);
CFRelease(bitmapCtx);
// create a new ui image
UIImage* newUiImage = [UIImage imageWithCGImage: newCgImage];
UIImage* oldImage = playerImageView.image;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:playerImageView cache:YES];
playerImageView.image = newUiImage;
[UIView commitAnimations];
[oldImage dealloc];
-- end of code --
These are the errors that I am getting:
cd /Users/ryanch/Documents/Score2
/Developer/Platforms/iPhoneSimulator.platform/Developer/usr/bin/gcc-4.0 -arch i386 -isysroot /Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator2.0 .sdk -L/Users/ryanch/Documents/Score2/build/Debug-iphonesimulator -F/Users/ryanch/Documents/Score2/build/Debug-iphonesimulator -filelist /Users/ryanch/Documents/Score2/build/Score2.build/Debug-iphonesimulator/Score.b uild/Objects-normal/i386/Score.LinkFileList -mmacosx-version-min=10.5 -framework Foundation -framework UIKit -o /Users/ryanch/Documents/Score2/build/Debug-iphonesimulator/Score.app/Score
Undefined symbols:
"_CGContextDrawImage", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
"_CGImageGetColorSpace", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
"_CGBitmapContextCreate", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
"_CGBitmapContextCreateImage", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
ld: symbol(s) not found
collect2: ld returned 1 exit status
"_CGContextDrawImage", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
"_CGImageGetColorSpace", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
"_CGBitmapContextCreate", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
"_CGBitmapContextCreateImage", referenced from:
-[MainViewController selectImageForCurrentPlayer:] in MainViewController.o
ld: symbol(s) not found
collect2: ld returned 1 exit status

In case anyone else finds this topic and wants the answer also (as I just figured out)...
Although you've included the right headers for CoreGraphics, you're not linking to the framework successfully. Open the Info box for your project. Under Build->Linking->Other Linker Flags, add the following:
-framework CoreGraphics

How do I print multiple identical small images on the same sheet of paper?

I would like to know how I can produce multiple identical small images (10mm x 10mm) on the same sheet of paper?
I used to be able to do this in older versions of Adobe Photoshop.
Thank you.

Try using picture package. There is an option to print 10 copies on a single sheet.
1. Select your photo in Organizer
2. Click File >> Print
3. Choose picture package in section 4 of the print dialog
4. Select layout in section 5 and choose fill page with first photo
5. Click print button
Click to view image

How do I create a new image composed of a number of smaller images?

Hi,
I'm attempting to work with the assorted image APIs for the first time and am experiencing one main problem with what I'm trying to do. Here's the scenario;
I have an image file (currently a JPEG) which is 320*200 pixels in size, it contains a set of 20*20 images. I want to take such a file and convert it into a new JPG file containing all those 20*20 images but in a different grid, for example a single column.
I'm currently having no problem in working my way through the input file and have created an ArrayList containing one BufferedImage for each 20*20 image. My problem is that I just can't see how to create a new file containing all those images in new grid.
Any help would be much appreciated and FWIW I've included the code I've written so far.
package mkhan.image;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Iterator;
import javax.imageio.ImageIO;
import javax.imageio.stream.ImageInputStream;
import javax.imageio.stream.ImageOutputStream;
public class ImageTileConvertor {
   // arg 1 = input file
   // arg 2 = output file
   // arg 3 = tile x dimension
   // arg 4 = tile y dimension
   // arg 5 = number of tiles in x dimension
   // arg 6 = number of tiles in y dimension
   public static void main(String[] args) throws IllegalArgumentException,
                                                 IOException {
     if (args.length != 6) {
       System.out.println("Invalid argument list, please supply the following information in the specified order:");
       System.out.println(" - The input file name including full path");
       System.out.println(" - The output file name including full path");
       System.out.println(" - The size of the tile in the x dimension");
       System.out.println(" - The size of the tile in the y dimension");
       System.out.println(" - The number of tiles in the x dimension");
       System.out.println(" - The number of tiles in the y dimension");
     } else {
       ImageTileConvertor imageConvertor = new ImageTileConvertor(args[0], args[1], args[2],
                                                                  args[3], args[4], args[5]);
   * Instance member vars
private File m_sourceFile = null;
private File m_outputFile = null;
private int m_tileSizeX = 0;
private int m_tileSizeY = 0;
private int m_numberOfXTiles = 0;
private int m_numberOfYTiles = 0;
   * Ctor
public ImageTileConvertor(String sourceFile, String outputFile,
                            String tileSizeX, String tileSizeY,
                            String tilesX, String tilesY) throws IllegalArgumentException,
                                                                 IOException {
    try {
      Integer tileSizeXInt = new Integer(tileSizeX);
      Integer tileSizeYInt = new Integer(tileSizeY);
      Integer tilesXInt = new Integer(tilesX);
      Integer tilesYInt = new Integer(tilesY);
      m_tileSizeX = tileSizeXInt.intValue();
      m_tileSizeY = tileSizeYInt.intValue();
      m_numberOfXTiles = tilesXInt.intValue() - 1;
      m_numberOfYTiles = tilesYInt.intValue() - 1; // convert to zero base
    } catch (NumberFormatException e) {
      throw new IllegalArgumentException("Tile Sizes must be integers");
    m_sourceFile = new File(sourceFile);
    m_outputFile = new File(outputFile);
    if (!m_sourceFile.exists()) {
      throw new IllegalArgumentException("Input file must exist and be a valid file");
    try {
      translateToTiles();
    } catch (IOException e) {
      throw e;
   * Performs the translation from one format to the other
private void translateToTiles() throws IOException {
    ImageInputStream imageIn = null;
    BufferedImage bufferedWholeImage = null;
    int imageHeight = 0;
    int imageWidth = 0;
    int currentX = 0;
    int currentY = 0;
    ArrayList imageList = new ArrayList();
    try {
      imageIn = ImageIO.createImageInputStream(m_sourceFile);
      bufferedWholeImage = ImageIO.read(imageIn);
      if (bufferedWholeImage != null) {
        imageHeight = bufferedWholeImage.getHeight();
        imageWidth = bufferedWholeImage.getWidth();
        if (((m_tileSizeX * m_numberOfXTiles) > imageWidth) || ((m_tileSizeY * m_numberOfYTiles) > imageHeight)) {
          throw new IOException("Specified Tile Size is larger then image");
        } else {
          // Process each tile, work in columns
          for (int i=0; i <= m_numberOfXTiles; i++) {
            for (int j=0; j <= m_numberOfYTiles; j++) {
              currentX = i * m_tileSizeX;
              currentY = j * m_tileSizeY;
              createTiledImage(imageList, bufferedWholeImage, currentX, currentY);
        createOutputTiles(imageList);
      } else {
        throw new IOException("Unable to identify source image format");
    } catch (IOException e) {
      throw e;
private void createTiledImage(ArrayList listOfImages, BufferedImage wholeImage,
                                int xPosition, int yPosition) {
    BufferedImage bufferedTileImage = wholeImage.getSubimage(xPosition, yPosition, m_tileSizeX, m_tileSizeY);
    listOfImages.add(bufferedTileImage);
private void createOutputTiles(ArrayList imageList) throws IOException {
    ImageOutputStream out = ImageIO.createImageOutputStream(m_outputFile);
    Iterator iterator = imageList.iterator();
    // This doesn't work at the moment, it appears to output all the images but the end file only seems to contain the first small image
    while (iterator.hasNext()) {
      BufferedImage bi = (BufferedImage)iterator.next();
      ImageIO.write(bi, "JPG", out);
      System.out.println(out1.getStreamPosition());
    out.close();
    // This is another attempt in which I can see how to populate a Graphics object with a small sample of the images
    // Although I'm not sure how to output this to anywhere in order to see if it works - can this approach output to a file?
    BufferedImage singleTile = (BufferedImage)imageList.get(0);
    // Now populate the image with the tiles
    Graphics gr = singleTile.createGraphics();
    gr.drawImage(singleTile, 0, 0, Color.BLACK, null);
    singleTile = (BufferedImage)imageList.get(1);
    gr.drawImage(singleTile, 0, 20, Color.BLACK, null);
}Thanks,
Matt

Construct a new BufferedImage whose width is the width of a tile, and whose height is the height of a tile times the number of tiles.BufferedImage colImg = new BufferedImage(m_tileSizeX,
                                         m_tileSizeY * m_numberOfXTiles * m_numberOfYTiles,
                                         BufferedImage.TYPE_INT_ARGB);Now write the tiles onto it.Iterator it = imageList.iterator();
int columnYPos = 0;
Graphics g = colImg.getGraphics();
while (it.hasNext())
    g.drawImage((Image)it.next(), 0, columnYPos, null);
    columnYPos += m_tileSizeY;
}Now save your image.*******************************************************************************
Answer provided by Friends of the Water Cooler. Please inform forum admin via the
'Discuss the JDC Web Site' forum that off-topic threads should be supported.

Small images not showing in design view

Desperate for help! I've been trying to diagnose this for a
long time. For some strange reason, images that used to show up in
my design view are now displaying the 'missing image' icon. I've
narrowed it down to this--if the image is less than 8px high, the
image will not display. When I increase it to 8px or more high
(width does not have any bearing on it), the image is displayed.
Same exact image name, same placement, path, file type, etc. The
only variable changed is the image height. Someone please tell me
what is going on. By the way, this just started to happen. These
small images were displaying fine up until yesterday.

You have two id="header" elements on the page....
I can see both the 5px tall GIF and JPG images just fine in
CS4.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"peregrinedesign" <[email protected]> wrote
in message
news:gmiaur$bv$[email protected]..
> OK, but I'm not sure this will help. Here's the page:
>
http://www.capitaloandp.com/orthotics.php
>
> What you will see is correct, and when I preview with a
browser it is fine
> also, it's only the DW design view that is not showing
the small jpeg.
> On the right side, there are two small black rectangles.
The one on the
> left
> is a gif, and the one on the right is the jpg. They were
both exported
> from the
> same original Fireworks file. I have tested using
Photoshop also.
>
> Thank you for your attention to this.
>

How can I copy a photo from iphoto to PReview to make it smaller for uploading to a site that requires a smaller image?

How can I copy a photo from iphoto to PReview to make it smaller for uploading to a site that requires a smaller image?

I don't think you need Preview.
Select the image and use File->export and you have full control over the size and compression.

HT5213 I am about to publish my iBook with photographs. It is interactive in that small images will go full screen when touched. Is there a size limit on my book? If so how many megs?

I am about to publish my iBook with many photographs. It is interactive in that small images will go full screen when touched. Is there a size limit on my book? If so how many megs?

2Gb is the max

How to handle small images e.g icons

I'm developing iPhone apps and when I design the icons in either photoshop or illustrator I always have the same problem. When working with very small images like 100px x 100px and smaller it's very hard to get a good resolution of the creation. For example when I make an icon in illustrator with a size of 76x76 the resolution obviously is good in illustrator since it's vector, but when I export the image it's first enlarged. And when I change the size back to 76x76 (using photoshop: image > image size) the resolution sucks. When I try to make the icon in photoshop from the beginning everything I draw gets blurry.
When designing large icons like 1000x1000 I never encounter this problem neither in photoshop nor illustrator. How am I supposed to do when working with small images?
Thanks

All of them? ??
How many did you actually check among the 13,900,000 hits returned by the Google search?

White line on small images

I inserted some small images to act as link-buttons. For some reason, some of them display a white line on the top. See the apple logo for instance here: http://kojema.net/cs/siteinfo.html
and the green buttons here: http://kojema.net/cs/audio.html
I used the same green button image another place, and there it did not display the white line. I used Aperture to crop the original images, and then simply dragged them into iWeb. What is causing this? The lines aren't visible in iWeb. But after I publish the site. there they are.
Thanks.
P.S. Is it just me, or does Firefox cause an enormous loss of color in jpegs?

There are a few solutions to the problem, see my post in this thread:
http://discussions.apple.com/thread.jspa?threadID=525470&tstart=0

My web pages appear out of alignment on small screens.

Hi,
My web pages are correct on my large monitor but, the right side of the pages go out of alignment on smaller screens such as my laptop or even if I reduce the window size of my monitor. I used a 2 col, hdr, ftr, liquid layout in html 5. I did a browser check and fixed the suggested errors but it didn't fix the alignment thing. The site is http://www.thelandingivylea.com

You have the wrong design for a liquid layout. Since you certainly want to retain your design, give the DIVs fixed widths.

How to i resize a larger 72ppi image to better quality smaller image but for correct size to paste into flyer

Hi, I am trying to resize a larger 16cm wide image saved at 72dpi to a smaller better quality 5cm wide image for invites for an art exhibition I am having. I figure there must be lots of information in the pic given that it is large, I just want to condense it into a smaller image. If I adjust the size to 5 cm wide it changes the dpi to 230 which would be better for printing (the 72 dpi is way too grainy). However when I paste it into the flyer I am making in photoshop it pastes as a massive picture. I then tried to drag the corners in to make it the right size and it became even grainier than a 5cm wide 72dpi image. I hope that makes sense to someone. So basically I need a 5cm wide document size that I can put in my small flyer that is the best quality I can make it! Thanks in advance!

Up-sampling from 72ppi to 300-600ppi can result in blurry images. It's always best to start with a good quality, high resolution image if you can. Go to Image > Image Size. When up-sampling, use Bicubic Smoother setting. When down-sampling, use Bicubic Sharper. See screenshot.
Nancy O.

How can i put one small image on another big image at particular point

Hi,
I have combined two images but new mask image is totally overwrite and come in whitecolored not in original color.....
I have user CGImageMaskCreate, CGImageCreateWithMask......
But i want to put small image on big image at particular point...... that i m tired to search but i can't find.......
Any thing is remaining then pls tell me...
Thanks,
Haresh.

Check the Quartz2D documents on Apple's site. Do a search in your examples folder in the developer folder and on Apple's site for Masks. I haven't used them under this API but that's probably the best place to start.

Adding small image to all shapes

I have created some oval domes, by making the shape and adding background via swatch. As you can see i have added a small bird image to 1st one, but need to know how to add to all at same time.
Can anyone tell me if it is possible to add a small image to each oval all in one go?
Do I have to convert the shapes 1st and if so to what?
Regards Budgie

budgie,
As I (mis)understand it now, you do have all the ovals with the background text/images (which may have been created in the way suggested in my post #2), and you wish to have the bird image on top of each, in one go.
In that case, you may, having create the bird image and placed it on top of the first oval:
1) Select the bird image and Effect>Distort & Transform>Transform, then insert the horizontal centre to centre distance between ovals as Move Horizontal with the desired number of copies (2 to correspond to the image);
2) Repeat 1) only with Move Vertical by the vertical centre to centre distance and the desired number of copies (1 to correspond to the image).
This should create copies of the bird image on top of the other ovals. You may Object>Expand Appearance to get individual images.
I managed to add bird via "stroke" as suggest above,
I am unsure about the meaning. My suggestion was (before adding the bird image) to Direct Select the Clippings Paths (the oval paths) and give (all of) them a stroke in one go.

Small images a link to bigger ones.

Is it possible in iWeb to make a small image a link to a bigger one? In other sites that I have seen you can click on an image and a larger one will come up.
Pat

Hi Jonathan,
When I responded to the OP's question, I assumed she was looking for a way to link to an image larger than the 800x600 maximum allowable size in iWeb, as in this example:
http://web.mac.com/mark8heaton/iPhoto/treemoving/BEF04635-B86E-4AD3-8064-1761884 E9D6B.jpg
Wasn't sure of the OP's intentions, just thought she wanted a way to link to a larger, external file, or a larger 'image page' by itself, in iWeb, rather than going directly to a slideshow page.
Mark

Alignment of small images

Similar Messages

Maybe you are looking for