I don't have experience with the APDE but I can make a suggestion to use sketchPath. In short, Android mode follows certain standard. Currently loadStrings look inside the data folder. Where is this folder? It is a space referred as the assets of an Android project. This space is read only. You should be able to call loadStrings, loadBytes, LoadImage, etc. Writing is a bit trickier however. From my experience, if you do

String fullPath = sketchPath("")+filename;

then you should be able to call

saveStrings(fullPath , saveData);
load = loadStrings(fullPath );

Where is the folder of sketchPath in Android? From what I understand, it is not in the assets folder but one folder down the path, but private to your application. This space is not accessible via some folder manager app in Android. (I will guess if your phone is rooted, then you should be able to see it).

There other ways to store data. Using the external storage would require access permissions as you might know.

Notice however that I am not sure if the APDE behaves the same way as Android Mode. I would suspect it does as there is no point to have two different source codes. The best thing you could do is to try to setup a simple test, just as what you did for this case above. Also, I suggest to check the data retrieved is not null and that you invoke those functions at two different times and no one call right after the other, meaning saving followed by a loading. Instead, you can do something like this:

void mousePressed(){

  if(mouseY>height/2)  //Tapped upper half of the screen

     //load your file

  else

    //save your file
}

This way, you ensure you are testing loading and saving and you don't have to worry conditional racing btw processes.

By the way, there is a new forum. Better if you continue any other conversation over there.

Kf

@kfrajer

Thanks for the advice. I checked to include the p5.dom.js library. I did.

I tried the other suggestions, but it did not work.

In the original code I have two variables with two arguments:

See the Pen Domain coloring by Juan Carlos Ponce Campuzano (@carlosponce) on CodePen.

I would like to replace these two with the inputs that I defined, but it does not work. Let's forget about the button for a second, if I replace these two variables and have a pre-defined value using the inputs such as

let inputRe; let inputIm;

function setup{ inputRe = createInput(); inputIm = createInput(); }

function draw{ inputRe.value('x-y') inputIm.value('x+y') }

I should be able to run the same code. But it does not work. :(

See the Pen Domain coloring with input by Juan Carlos Ponce Campuzano (@carlosponce) on CodePen.

I am not sure if I am calling back the correct values or do I need to parse them somehow?

@Chrisir

The avatar pic is indeed a recursive function made with paper, similar to a Spierpinski triangle... Cheers!

Thanks

If you drag the jar into your code in the PDE, then you should be able to access that library (Untested). This is how it works in Processing java and I would assume it is similar for Android mode. If you export the pde into AS, you should be able to see where the jar is located... I believe it will be in the libs folder.

One thing: Do you need to open your csv file in draw()? If not, move it to setup().

Regarding the assets, accessing files, dataPath(), etc. check this: https://forum.processing.org/two/discussion/comment/118947/#Comment_118947

Kf

Strange, I added the csv file to the assets folder and it didn't read it. I added an assets folder inside the src folder and it read it without any additional code.

The problem now is that I'm using a library to work on the data from the csv and it says NullPointerException lock == null. Whole different problem now.

@HarryCodes===

Put your file in the assets folder (create it); then get it using AssetManager

https://forum.processing.org/two/search?Search=Assets

Kf

Hello,

I am working on a game project. Currently I am trying to set up an introductory cut scene using some audio files and pictures. When finished I am hoping it will look something like a slide show.

I have loaded into my program an audio file roughly 1 minute in length and 9 pictures that will take up a 1600x900 screen. When I click run in the IDE there is about a 2 second delay before the program runs. My question is, how would I create a loading screen to give the player some feedback that the game is just loading the different assets?

If anyone knows of any examples or tutorials that I could read through that would be very helpful. I feel like I need to understand more about how this process works before I can get to coding. Thank you for the help.

I referenced p5.js and p5.dom.js and, of course, Evolution.js

Evolution.js:

var img;
var X;
var Y;
var noclipspeed = 20
var Z
var shp
var shpi
var speed
var freecam = false
var XR = 0
var YR = 0
var debug = true
function preload() {
town = loadImage('./assets/town.png');
BG = loadImage('./assets/BG.png');
X = random(-250,250)
Y = random(-250,250)
Z = 1
shop = loadImage('./assets/shop.png')
hax = loadImage('./assets/hax.png')
cursor(CROSS)
}


function setup() {
 createCanvas(1905,1065,WEBGL);
}


function draw() {
  rotateY(XR)
  rotateX(YR)
  cursor(CROSS)
  keyPressed()
  translate(0,0,10000)
  texture(hax)
  plane(10000,10000)
  translate(0,0,-10000)
  translate(0,0,-10000)
  texture(BG)
  plane(10000000,1000000)
  texture(town)
  translate(0,0,10000)
  translate(X-1000,Y-1000,Z)
  plane(950,567)
  translate(800,750)
  texture(shop)
  plane(100,100)
  if(freecam === false) {
  if (Z>577) {
  Z = 577
} else if (Z < -2600) {
  Z = -2600
} else if (Z === 0 ) {
 Z = 1
}
}
if (shpi === 1) {
Z = 577
X = -814.219833927416
Y = -751.7183831208923
}
if (noclipspeed < 10) {
noclipspeed = 10
}
}

function keyPressed() {
 if (keyIsDown(70)) {
   fullscreen(1)
} else if (keyIsDown(78)) {
   fullscreen(0)
} else if (keyIsDown(79)) {
    freecam = true
  } else if (keyIsDown(76)) {
    freecam = false
    XR = 0
    YR = 0
  } else if (keyIsDown(113)) {
saveCanvas("EvolutionTST","png")
}
 if (freecam === false) {
 XR = 0
 YR = 0
 if (keyIsDown(65)) {
    X+=10;
  } else if (keyIsDown(68)) {
    X-=10;
  } else if (keyIsDown(87)) {
    Y+=10;
  } else if (keyIsDown(83)) {
    Y-=10;
  } else if (keyIsDown(70)) {
   fullscreen(1)
  } else if (keyIsDown(78)) {
   fullscreen(0)
  }
} else {
 if (keyIsDown(65)) {
    X += noclipspeed
} else if (keyIsDown(68)) {
    X -= noclipspeed
} else if (keyIsDown(87)) {
    Z += noclipspeed
} else if (keyIsDown(83)) {
    Z -= noclipspeed
} else if (keyIsDown(32)) {
    Y += noclipspeed
} else if (keyIsDown(16)) {
    Y -= noclipspeed
} else if (keyIsDown(39)) {
    XR += 0.05
} else if (keyIsDown(37)) {
    XR -= 0.05
} else if (keyIsDown(38)) {
    YR -= 0.05
} else if (keyIsDown(40)) {
    YR += 0.05
} else if (keyIsDown(107)) {
    noclipspeed += 10
} else if (keyIsDown(109)) {
    noclipspeed -= 10
} 
}
}

function mouseWheel(event) {
   Z -= event.delta
}

1. Load assets in preload() instead: https://p5js.org/reference/#/p5/preload :-c
2. Method get() is either 0, 2, or 4 parameters: https://p5js.org/reference/#/p5.Image/get
3. Therefore var pixC = img.get(index); @ line #18 w/ 1 parameter is wrong! :-&
4. Instead, access pixels[] for both read & write: https://p5js.org/reference/#/p5.Image/pixels
5. color() returns a p5.Color object, not an array[]: L-)
   https://p5js.org/reference/#/p5/color --> https://p5js.org/reference/#/p5.Color
6. The RGBa pixels[] is of datatype Uint8ClampedArray: :-B
   https://Developer.Mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8ClampedArray
7. If you prefer to access the RGBa pixels[] as a whole 32-bit value rather than 4 8-bit separate values, you can create an Int32Array (or an Uint32Array) buffer view of pixels[]: *-:)
   const pixels32 = new Int32Array(img.pixels.buffer);
8. That'll greatly simplify traversing, reading, comparing & writing to pixels[], given each index is now 1 RGBa value rather than split across 4 indices. \m/

If you want a library for dashed lines on a wide variety of shapes, try Dashed Lines for Processing:

• https://github.com/garciadelcastillo/-dashed-lines-for-processing-

For lines, the Processing reference also has an example of using lerp to draw dotted lines.

• https://processing.org/reference/lerp_.html
• https://forum.processing.org/two/discussion/16338/lerp-and-dotted-lines

This method can be used radially as well for r rather than x,y.

Hi there

When I developed Android apps with Processing, I always used some custom fonts that I left in the "assets" folder. Making a multi-lingual version of my app, I don't want to add some heavy .ttf or .otf files to my package

How do I createFont() from a default Android fonts, with one that will work in Unicode (CJK included) ?

cheers

@Deiplz -- I'm not sure I understand your question, but I'll take a stab at it.

1. You have 12 PImages -- 6 white, 6 black.

2. You have a mousePressed function that checks for only 6 PImages -- specifically, the black ones. Your checks look like this:

   if (locations[clicky][clickx] == bqueen) {
   

3. "but for some reason, it doesn't work for white" -- because you aren't testing for white pieces when you click the mouse?

4. "if I switch the sides around, it becomes black that doesn't work" -- I don't know what you are switching -- the graphics assets, or something else -- but if you are only click-testing for 6 piece types, you are only going to be able to recognize 6 piece types.

If you place your images in data/images then you can access them via:

  String[] con=null;
  try {
    con=surface.getAssets().list("images");
    println("====================");
    println("ALL Images in assets/images");
    if (con!=null)  println(con);
    else            println("NOTHING in current assets/images");
  }
  catch(IOException e) {
    println("ERROR::NOW");
    e.printStackTrace();
  }

To filter them do this:

if (con!=null) {
    ArrayList<String> result = new ArrayList<String>();  
    for (String strFile : con) {
      if (strFile.toLowerCase().endsWith(".png")) {
        result.add(strFile);
        println("Adding => "+strFile);
      }
    }
  }

Related references:

https://forum.processing.org/two/discussion/comment/118947/#Comment_118947
https://developer.android.com/reference/android/content/res/AssetManager.html

Kf

Glad it was a helpful suggestion, @Milind. Often a big selling point for people on using a new "brainstorm / sketch" method is if they can then bring some result of that process into their familiar processes -- or, conversely, if they can bring assets out of their normal process into the creative brainstorm area. This doesn't mean you have to focus on integration, of course! -- just that if you think through how compatibility would work then knowing how might be helpful when planning how to address your audience.

I am not familiar with the ARCore or the ARKit. I have seen some videos online. What is the current state of ARCore? What are people using it for and how are they using it? It is an interested project btw.

if any 3D asserts provided by the user will be accepted. Example, to apply texture onto a 3D object, I can use an image as it's texture, similarly is there any possibility that I can import an mesh that is exported from Maya or 3ds Max

Not an expert on OBJ files but I will say this: Not sure if any 3D asset will be readily accepted by Processing on the Android side. It depends on the design and the way these type of objects are handled which I am not familiar with. I can only say that exports from Maya are very likely to work. Daniel Sauter in his book Rapid Androdi Developmnet made a reference to this:

Working in 3D, Object ( obj ) is a very popular and versatile file format. We can use an OBJ as a self-contained 3D asset and load it into a 3D app on our Android. All the textures for our figure are already predefined in the OBJ file, making it fairly easy to handle in Processing with our familiar PShape class. Yes, it handles OBJ files as well.

Object files are not XML -based in their organizational structure, but they still contain data segments with coordinates for the vertices that define the figure and data segments that link to assets such as materials and textures to the file. The model we’ll work with was loaded from Google Sketchup’s 3D warehouse and converted into the Object format using Autodesk Maya.

Sample file here: https://github.com/ketai/rapid-android-development/tree/master/ShapesObjects/ObjectFiles

However, from what I have seen in the forum, not all obj files seem to be compatible - some have problems when they are loaded. But then again, I have only seen the bad apples... maybe the PShape class performs well or maybe the obj structure file needs to follow a specific format. That is something you should add in your proposal and investigate. For the initial prototype you should stick to a reliable source of object assets. I will probably follow the same source as used by ARCore.

Ok, changing gears. In your second question in your last post:

They advice using relative co-ordinates. Since the objects are placed along with the anchor points are highly relative in the environment

So is it currently known what is the best approach to place and track these objects? They talk about relative coordinates and anchor points. Are the relative coordinates based on these anchor points? Let me re-phrase my question: What is the definition of local coordinate system and what is an anchor point - from your reference? Is it know if active sensors like gyros and accelerators are used in the process at all? or are they unreliable for this technology.

Kf

Hopefully the following sketch provides some insight of how to manage resources. The main purpose of this demo is to show how to save or open files. When the application runs for the first time, it shows the content of the folder where any new files are created (either by saveStrings(), saveBytes(), etc) as well as the content of the assets folder. Notice that any created file by Processing function is not created in the assets folders as this folder is read only and any of these assets are only access via surface.getAssets().open(filename) function.

As I was describing, when the application runs the first time, it list the content of resources. Then you will have a split screen. Do the following:

1. Click on open file: Notice that at this point the file doesn't exist, so not file found is seen in the console
2. Click on save data: A file is created with three lines
3. Click on open data: The first line of the last saved file is presented.

When the green message box is shown, it last for 2 seconds. For those two seconds you are not allowed to neither open nor create any file. However, if you click on the screen before the green box disappears, you will get a report of your resource folders and your current file storing strings will be deleted.

Notice that when you save a file, and if you are not using the external storage, you do not need to specify the folder "data" inside this path. This is handled by Processing either if you are running your sketch in Java or in Android mode. Check the code and ask any question you have or if you have any idea to improve it or provide additional comment.

Last point: No permissions required for this sketch. Notice that "write on external device" permission is required if you decide to use external storage to save your files.

Kf

//===========================================================================
// IMPORTS:

import android.app.Activity;
import android.content.Context;
import android.widget.FrameLayout;
//import android.app.Fragment;

import android.os.Environment;
import android.graphics.Color;
import android.widget.Toast;
import android.os.Looper;
import android.view.WindowManager;
import android.os.Bundle;
import android.view.ViewParent;
import android.view.ViewGroup;
import android.view.View;
import android.widget.RelativeLayout;
import android.view.LayoutInflater;
import android.R.string;


//===========================================================================
// FINAL FIELDS:
final int DURATION=2000;
final String FILENAME="mylist.txt";

//===========================================================================
// GLOBAL VARIABLES:

Activity act;
Context mC;
int startTime=0;
String message;

//===========================================================================
// PROCESSING DEFAULT FUNCTIONS:

void setup() {
  fullScreen();
  orientation(PORTRAIT);
  background(0);

  act = this.getActivity();
  Looper.prepare();

  textAlign(CENTER, CENTER);  

  fill(255);
  noStroke();
  textSize(32);
  message="";

  reportAssetsAndFiles();
}


void draw() {
  if (frameCount%300==0) background(0);

  fill(88);
  rect(0, 0, width, height/2);
  fill(255);
  text("Save file", width/2, height/4);

  fill(144);
  rect(0, height/2, width, height/2);
  fill(25);
  text("Open file", width/2, 3*height/4);

  //SHOW messagge
  if (doneTime()==false) {
    background(0);
    fill(0, 200, 0, 150);
    rect(width/4, height/2-100, width/2, 200);
    fill(255);
    text(message, width>>1, height>>1);
  }
}


void mouseReleased() {

  //  xxxxxxxxxx_____________xxxxxxxxxx
  //If showing message, do not event try to open or save file
  if (doneTime()==false) {
    reportAssetsAndFiles();
    return;
  }

  //  xxxxxxxxxx_____________xxxxxxxxxx
  //Clicked on bottom half: Open file
  if (mouseY>height/2) {
    File cfile = surface.getFileStreamPath(FILENAME);  
    if (!cfile.exists()) {
      println("File NOT found");
      return;
    }

    String[] in=loadStrings(FILENAME);

    if (in!=null) {
      if (in.length>1) 
        message="Read first line=>"+in[0];
    } else {
      message="Fail to open file";
    }
    startTime=millis();
    return;
  }

  //  xxxxxxxxxx_____________xxxxxxxxxx
  //Click on top half: Save file
  String[] list ={"Time:"+millis(), "Date:"+day()+"/"+month(), "Info:123456789"};
  saveStrings(FILENAME, list);
  startTime=millis();
  message="Saved text => " + list[0];
}

boolean doneTime() {
  return millis()-startTime>DURATION;
}


//===========================================================================
// OTHER FUNCTIONS:
void reportAssetsAndFiles() {

  //List content of your sketchPath: https:// github.com/processing/processing-android/blob/master/core/src/processing/core/PApplet.java#L5068
  println("====***=== SKETCHPATH report");
  File folder = surface.getFileStreamPath("");
  String[] sketchPathLoc=folder.list();
  println(folder.getAbsolutePath());


  if (sketchPathLoc!=null) println(sketchPathLoc);
  else                     println("NOTHING in current loc");

  //Delete file if exists
  File cfile = surface.getFileStreamPath(FILENAME);  
  if (cfile.exists()) {
    println("====**=== "+FILENAME+" deleted");
    cfile.delete();
  }

  println("====***=== ASSETS report");
  try {
    String[] con=surface.getAssets().list("");
    if (con!=null)  println(con);
    else            println("NOTHING in current assets");
  } 
  catch(IOException e) {
    //Do nothing
  }
}


@ Override 
  public void onResume() {
  super.onResume();

  act = this.getActivity();
  mC= act.getApplicationContext();

}

Keyword: kf_keyword android_assets android_sketchpath android_savefile save_files savefiles

• For security reasons, browsers don't allow access to arbitrary paths within a computer's local file system! [-X
• Unless they're located anywhere within the ".html" file's folder.
• For example, in this sketch: https://ThimbleProjects.org/gotoloop/97931/
• Image files "moonwalk.jpg" & "mask.png" are inside subfolder "assets/" of the "index.html"'s folder:

1. https://ThimbleProjects.org/gotoloop/97931/assets/moonwalk.jpg
2. https://ThimbleProjects.org/gotoloop/97931/assets/mask.png

• If you really need to load resources from arbitrary local paths, you're gonna need to ask the user to pick them up for you, either from some file dialog or file drop zone.
• BtW, given each instance of your class represents 1 campeone object, it should be a singular name, like Campeone, not a plural 1. ;;)
• Also its method Clicked() shouldn't be capitalized. Use lower case for methods: clicked() ~O)

Your problem may be that you probably need sprite sheets, not gifs. You CAN also load gifs as sprite assets....

• https://processing.org/examples/animatedsprite.html

But for four-direction motion, that may not be what you want. You may want sheets instead.

Look at the processing sprites library.

• http://www.lagers.org.uk/s4p/index.html

Also, look at free online game assets, many of which have categories for sprite sheets.

• https://opengameart.org/
• https://itch.io/game-assets/tag-sprites
• https://www.gameart2d.com/freebies.html
• https://craftpix.net/categorys/sprites/

@noel===

• as for the first question: yes, though on some devices it's better to add "getWindow().getDecorView()..." - in order to understand better: when Processing creates the fragment in which you are it creates a frameLayout (that s why in have written "fl") and uses the "convert" to add it: setContentView(...)

• as for the second one: with android each element has an id (which is an integer, sometimes associated with a string); so you can get this element using this id which can be set by XML or by code using ".setId()" - Yet you can create a view, like an imageButton without it: you declare it by name: "ImageButton ib" then make an instance; new()...and can get it by its "name" (ib) when you want, even if you have not set its (integer) id (android creates it for you in the R file)

• as for the third one: you can set by code the image for your imageButton with ib.setImageResource or setImageBitmap(); as for P5 i think (no tested) that it is better to use the second one, putting the image or images in the assets folder.

Hey! I have this problem similar to yours. Would like to ask if you can explain a bit more about a static method. How I should use it in exactly?

public static PImage getImage(String url) throws Exception{
    BufferedImage image = ImageIO.read(Applet.class.getResourceAsStream("assets/vase.jpg"));
    return new PImage(image);
}
public void setup(){

    img = loadImage(("assets/vase.jpg"));
    img.resize(400, 0);
    // Create a new empty image;
    resultImg = createImage(img.width, img.height, PConstants.RGB);
    convolution(embossKernel);
}

I tried to called in around this code but did not work!?

Right now, the picture is called fine in Eclipse environment but with export to jar it could not find the image. So I'm trying to write the correct path to the file for jar.