# Help For App (Like instagram)

**URL:** https://discourse.processing.org/t/help-for-app-like-instagram/23573
**Category:** Processing for Android
**Created:** [August 30, 2020, 9:29pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573 "2020-08-30T21:29:36Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 30, 2020, 9:29pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/1 "2020-08-30T21:29:37Z")

</div>

i need your help, i have a project for a game just need help from you guys.  
I want to pack several pictures on top of each other so that I can swipe up / down how does it work on insta?

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 30, 2020, 9:44pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/2 "2020-08-30T21:44:58Z")

</div>

I guess the best solution is to use a WebView, because it is “swipe-able”.  
See an example [here](https://github.com/EmmanuelPil/Android-java-code-utilities-widgets-for-Processing-for-Android). Instead of a page on the web, you refer a local one.

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 30, 2020, 9:50pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/3 "2020-08-30T21:50:25Z")

</div>

I mean Like this [https://youtu.be/Ci5146VOyg4](https://youtu.be/Ci5146VOyg4) only high

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 30, 2020, 9:57pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/4 "2020-08-30T21:57:48Z")

</div>

Have you tried the WebView but with instead of Google the Instagram address?

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 30, 2020, 10:08pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/5 "2020-08-30T22:08:42Z")

</div>

yes, but I don’t want to see an Instagram page, just not the pictures😂

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 30, 2020, 10:13pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/6 "2020-08-30T22:13:00Z")

</div>

That’s why I said, make your own local local page with pictures on top of each other and voila.

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 30, 2020, 10:16pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/7 "2020-08-30T22:16:52Z")

</div>

without using Instagram this was just an example

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 30, 2020, 10:19pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/8 "2020-08-30T22:19:58Z")

</div>

Yes, use some web editor app, make a new page and put the pictures you want and you’r done.

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 30, 2020, 10:27pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/9 "2020-08-30T22:27:44Z")

</div>

can you show me an example

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 30, 2020, 10:47pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/10 "2020-08-30T22:47:27Z")

</div>

Tomorrow I’ll post one. It’s late here. Good night.

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 31, 2020, 5:09am UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/11 "2020-08-31T05:09:36Z")

</div>

Thanks and good nicht👍🏻

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 31, 2020, 6:32pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/12 "2020-08-31T18:32:02Z")

</div>

@noel can you pleased Help me now or No Time?

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 31, 2020, 7:05pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/13 "2020-08-31T19:05:13Z")

</div>

I’m at work at the moment.  
As soon as I get home I will try.

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [August 31, 2020, 7:25pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/14 "2020-08-31T19:25:59Z")

</div>

Thank you 😇

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [August 31, 2020, 10:54pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/15 "2020-08-31T22:54:30Z")

</div>

Try the following code.  
You have to make a web page with images.  
You can do this by copying the following to a text editor and save it with the extension .html (myPage.html) You have of course to change the name and size of the images and website accordingly to yours.  
Save all the images + the web page in the sketch data folder.

```auto
<!DOCTYPE html>
<html>
   <head>
      <title>HTML img Tag</title>
   </head>
   <body>
      <img src="image1.png" alt="Image name" width="400"
         height="480">
		 <br>
		 <img src="image2.png" alt="Image name" width="400"
         height="480">
		 <br>
		 <img src="image3.png" alt="Image name" width="400"
         height="480">
		 <br>
		 <img src="image4.png" alt="Image name" width="400"
         height="480">
		 <br>
		 <img src="image5.png" alt="Image name" width="400"
         height="480">
		 <br>
		 <img src="image6.png" alt="Image name" width="400"
         height="480">
   </body>
</html>

```

Do not forget to give the internet permission!

```auto
import android.webkit.WebViewClient;
import android.view.ViewGroup.LayoutParams;
import android.webkit.WebView;
import android.view.ViewGroup;
import android.app.Activity;
import android.widget.RelativeLayout;
import android.widget.FrameLayout; 
import processing.android.CompatUtils;
import android.view.View;

FrameLayout fl;
Activity act;
WebView web;
WebViewClient wbc; 
int webId;
boolean toggle;

public void onStart() { 
  super.onStart(); 
  act = this.getActivity(); 
  wbc = new WebViewClient(); 
  web = new WebView(act); 
  web.setLayoutParams(new RelativeLayout.LayoutParams( RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT)); 
  web.setY(60);
  web.setWebViewClient(wbc); 
  web.getSettings().setJavaScriptEnabled(true); 
  web.loadUrl("file:///android_asset/new1.html"); 
  webId = CompatUtils.getUniqueViewId();
  web.setId(webId);
  //web.setVisibility(View.GONE);
  fl = (FrameLayout)act.getWindow().getDecorView().getRootView(); 
  fl.addView(web);
} 
void setup() {
  background(0, 0, 100);
  fullScreen();
  textAlign(CENTER);
  textSize(40);
  fill(255);
  text("Click to open/close WebView", width/2, 45);
}

void draw() {
}

void mousePressed() {
  if (mouseY < 60) {
    act.runOnUiThread(
      new Runnable() {
      public void run() {  
        WebView wv = (WebView)act.findViewById(webId);
        if (toggle) {
          wv.setVisibility(View.VISIBLE);
        } else {
          wv.setVisibility(View.GONE);
        }
      }
    }
    );
    toggle =! toggle;
  }
}

```

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [September 1, 2020, 11:23am UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/17 "2020-09-01T11:23:49Z")

</div>

where is my mistake?

 ![Screenshot_20200901-132147_APDE Sketch Preview](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/f/fce4d074961dfc52665778b0e9763f56cd670a5c.jpeg) ![Screenshot_20200901-132201_My Files](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/b9dbf15d3b74e5da56ff17f2dcb182527339030d.jpeg) ![Screenshot_20200901-132222_APDE](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/60d0e6f77aa15ceb763de5de40fc17b5adde1426.jpeg)

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [September 1, 2020, 11:41am UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/18 "2020-09-01T11:41:02Z")

</div>

Who wrote that line "Internal storage/Sketchbook/…etc ?

It has to be web.loadUrl(“file:///android\_asset/new1.html”);  
Where you only change the file name “new1.html” to what you are using. (Site.html I believe)  
This address points to the data folder in your sketch.  
I also see that you are using small images. (icons?)  
So maybe what you want is just one image that you can slide from the top to the bottom to click and choose player types or something. Thus no scrolling needed like Instagram.

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [September 1, 2020, 11:52am UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/19 "2020-09-01T11:52:57Z")

</div>

I now also see, that you are using APDE’s preview mode. When you are using certain permissions like INTERNET (setting in the menu properties), you need to use the App mode, otherwise it won’t find the web page.

---

<div class="post-metadata">

### Author: ![Dominik\_rgn](https://avatars.discourse-cdn.com/v4/letter/d/a9adbd/32.png) [@Dominik\_rgn](https://discourse.processing.org/u/Dominik_rgn)
#### Post date: [September 1, 2020, 3:13pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/20 "2020-09-01T15:13:55Z")

</div>

Omg xd haha thank you

---

<div class="post-metadata">

### Author: ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)
#### Post date: [September 1, 2020, 3:20pm UTC](https://discourse.processing.org/t/help-for-app-like-instagram/23573/21 "2020-09-01T15:20:02Z")

</div>

But is this what you need?

[Next page](https://discourse.processing.org/t/help-for-app-like-instagram/23573.md?page=2)
