place image on top of the coordinate of a certain character

Programming Questions

martine14..

place image on top of the coordinate of a certain character

in Programming Questions • 4 months ago

Hi!

Im trying to make a code which changes the letters in a text, and places a image on top of the certain letter that is changed.

So far I have managed to replace the characters and upload the images, that belongs to the certain letters.

What I'm missing now is a variable that decides the placement of the image - depending on where on the canvas the letter is placed. And also a variable that counts the letters in the word the certain letter is placed, which should decide the size of the image.

This is my script so far, hope someone can and will help me, it will be much appreciated! :)

PFont f;

PImage S1, S2, S3, S4, S5, S6, S7, S8, S9, S10, S11, S12, S13, S14;

void setup() {

size(500, 700);

background(255);

smooth();

f=loadFont ("Lane-Narrow-20.vlw");

S1=loadImage ("1.gif");

S2=loadImage ("2.gif");

S3=loadImage ("3.gif");

S4=loadImage ("4.gif");

S5=loadImage ("5.gif");

S6=loadImage ("6.gif");

S7=loadImage ("7.gif");

S8=loadImage ("8.gif");

S9=loadImage ("9.gif");

S10=loadImage("10.gif");

S11=loadImage("11.gif");

S12=loadImage("12.gif");

S13=loadImage("13.gif");

S14=loadImage("14.gif");

}

int yp=150;

void draw() {

String quote1[] = loadStrings ("BM1.txt");

for (int c=0; c<quote1.length; c++) {

println (quote1[c]);

println ("..........");

String replaceNON = quote1[c].replace("o", "o");

String replaceO = replaceNON.replace("o", "å");

println (replaceO);

String replaceU = replaceO.replace("u", "o");

println (replaceU);

String replaceCH = replaceU.replace("ch", "k");

println (replaceCH);

String replaceCCH = replaceCH.replace("cch", "kk");

println (replaceCCH);

String replaceCI = replaceCCH.replace("ci", "tsji");

println (replaceCI);

String replaceCCI = replaceCI.replace("cci", "tsji");

println (replaceCCI);

String replaceGLI = replaceCCI.replace("gli", "jli");

println (replaceGLI);

String replaceZI = replaceGLI.replace("zi", "dzi");

println (replaceZI);

String replaceCE = replaceZI.replace("ce", "tshe");

println (replaceCE);

String replaceCCE = replaceCE.replace("cce", "tshe");

println (replaceCCE);

String replaceGI = replaceCCE.replace("gi", "dji");

println (replaceGI);

String replaceGGI = replaceGI.replace("ggi", "dji");

println (replaceGGI);

String replaceGE = replaceGGI.replace("ge", "dje");

println (replaceGE);

String replaceGGE = replaceGE.replace("gge", "dje");

println (replaceGGE);

println (wordLengths);

fill(0);

text(replaceGGE, 40, yp);

yp=yp+35;

tint(255, 80);

imageMode (CENTER);

if (replaceNON.indexOf("o") >= 0) {

image (S1, 100, 200, 30, 30);

}

if (replaceNON.indexOf("u")>=0) {

image (S2, 200,80, 30, 30 );

}

if (replaceNON.indexOf("ch")>=0){

image (S3, 300, 90, 30, 30);

}

if (replaceNON.indexOf("cch")>=0){

image (S4, 200, 70, 30,30);

}

if (replaceNON.indexOf("ci")>=0){

image (S5, 200, 70, 30, 30);

}

if (replaceNON.indexOf ("cci")<=0){

image (S6, 300, 50, 30, 30);

}

if (replaceNON. indexOf ("gli")<=0){

image (S7, 100, 100, 30, 30);

}

if (replaceNON.indexOf ("zi")>=0){

image (S8, 100, 40, 30, 30);

}

if (replaceNON.indexOf ("ce")>=0){

image (S9, 200, 50, 30, 30);

}

if (replaceNON.indexOf ("cce")>=0){

image (S10, 100, 30, 30, 30);

}

if (replaceNON.indexOf ("gi")>=0){

image (S11, 50, 40, 30, 30);

}

if (replaceNON.indexOf ("ggi")>=0){

image (S12, 70, 90, 30, 30);

}

if (replaceNON.indexOf ("ge")>=0){

image (S13, 300, 200, 30, 30);

}

if (replaceNON.indexOf ("gge")>=0){

image (S14, 150, 150, 30, 30);

}

noLoop();

}

Replies(3)

GoToLoop

Re: place image on top of the coordinate of a certain character

4 months ago

W/o using Arrays or classes, it's pretty hard to come up w/ a solution which can deal efficiently to all of them.

martine14..

Re: place image on top of the coordinate of a certain character

4 months ago

ok, so you don't think it's possible? Have any idea on how it could be done? I'm very new to processing, and not too familiar with the different possible solutions. :)

GoToLoop

Re: place image on top of the coordinate of a certain character

4 months ago

Ok, so you don't think it's possible?

The way your code is w/o using a form to organize your collection of images

and quotes isn't practical to come up w/ 1.

Of course there would be other tedious and tiresome ways to do it!

I'm very new to Processing, and not too familiar with the different possible solutions.

Actually, solutions to it are very ordinary!

And isn't about Processing only, but for any other programming language!

You already know that variables can store 1 value only. That's why u made 14 to store the loaded images.

But rather than make x # of variables for a collection of images,

you can create just 1 Array to store all of them!

Take a look @ here -> http://processing.org/reference/Array.html & http://processing.org/reference/arrayaccess.html

So, you'd have all your 14 images under the same umbrella label.

Only difference from a regular variable is that you'd must use an integral index,

from 0 up to 13, to access/extract the stored values in that Array!

Here's a sample of your program using it. But still has much more to do though:

final static byte NUM_IMAGES = 14;
final PImage[] imgs = new PImage[NUM_IMAGES];

final static String FILE_NAME = "BM1.txt";
String quotes[];

void setup() {
  size(500, 700);
  smooth();
  noLoop();

  for ( int i = 0; i != NUM_IMAGES; 
  imgs[i++] = loadImage(i + ".gif") );

  quotes = loadStrings(FILE_NAME);
}

Top Reply