# Android transparency and windows transparency

**URL:** <https://discourse.processing.org/t/android-transparency-and-windows-transparency/32574>\
**Category:** Processing for Android\
**Created:** [October 3, 2021, 9:35am UTC](https://discourse.processing.org/t/android-transparency-and-windows-transparency/32574 "2021-10-03T09:35:28Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 3, 2021, 9:35am UTC](https://discourse.processing.org/t/android-transparency-and-windows-transparency/32574/1 "2021-10-03T09:35:28Z")

</div>

Came across a weird problem with the transparency the same code produces different results in android vs windows. I’m coding some themes for the windows and would like to include transparency. It works in windows, but not in android.

Ive linked the sketchfiles and all required jars on github.

> **[GitHub - paulgoux/window-transparency-test](https://github.com/paulgoux/window-transparency-test)**
>
> Contribute to paulgoux/window-transparency-test development by creating an account on GitHub.

and have extended the window class so I could try to debug the issue.

```auto
class wnd extends Window{
  //applet = b;
  wnd(float xx,float yy,float ww,float hh,String dir,BMS bms){
    //super(b);
    x = xx;
    y = yy;
    w = ww;
    h = hh;
    bw = w;
    bh = h;
    Bms = bms;
    applet = bms.applet;
    theme = Bms.theme;
    list = fileUtils.listFileNames(dir);
    link = dir;
    currentp = dir;
    
    initqNav();
    initGrid();
    //cols = 10;
    println(buttons.size(),cols);
    canvas1 = applet.createGraphics((int)w-10,(int)(rowheight*3.5));
    canvas2 = applet.createGraphics((int)w-10,(int)(rowheight*3.5));
  };
  
  wnd(boolean k){
    initqNav();
  };
  
  public void displayGrid(){
    //    
    h = (7+1) * 50;
    //if(mousePressed)
    
    open = true;
    Slider s = null;
    if(sliders.get(0)!=null)s = sliders.get(0);
    s.h = h;
    s.setRadius(0,0,20,0);
    if(toggle||applet.frameCount==0) {
      open = true;
    }else {
      open = false;
    }
    if(close){
      toggle = false;
      open = false;
      close = false;
    }

    if(open||firstRun||buttonHover) {
      canvas1.beginDraw();
      canvas1.background(255,0);
      //canvas1.fill(theme.windowfillcol,theme.windowtransparency/40);
      canvas1.noStroke();
      //if(firstRun||buttonHover)canvas1.rect(0,0,w,h,r1,r2,r3,r4);
    }

    if(open){
      Window w2 = windows.get(windows.size()-1);
      mouse = getMouse();
      float ay = 70;
      if(w2!=null&&!fileDir.toggle) {
        fileDir.label = w2.link;
      }
      //else fileDir.textBox = "";
      
      fileName.setPos(x+20,y+h-ay);
      fileDir.setPos(x+90,y - 45);
      select.setPos(fileName.x+20+fileName.w,y+h-ay);
      drawBorder();
      drawNav();
// if(getClose())close = true;
      //id();
      drawRapidOptions();
      select.draw();
      select.toggleAll();
      select.toggle(0,this,"close");
      select.toggle(1,this,"close");
      drawScrollbar();
      gridlogic();
      grid();
      fileName.draw();
      fileDir.draw();

      if(open||firstRun) {
        canvas1.endDraw();
        update = false;
        firstRun = false;
      }
    }
    
    if(open)applet.image(canvas1,x,y);
  };
  
  public void grid(){
    Window w2 = windows.get(windows.size()-1);
    Slider s = sliders.get(0);
    // s.mouseFunctions();

    // s.set(0,2000);
    mouse = getMouse();
    mouse.y+=20-s.value;
    counter = 0;
// applet.println("window",y,h);
    int miny = (int)(s.value/rowheight);
// applet.println("window",miny,rows);
    int maxy = miny+5;
    if(true) {
      for(int i=0;i<7;i++){
        maxy = miny+5;
        for(int j=0;j<10;j++){

          int pos = j+i*cols;
          Button b = null;
          
          if(pos<w2.buttonGrid.size()){
            b = w2.buttonGrid.get(pos);
            Button b1 = w2.buttons.get(pos);
            b.visible = false;
// applet.println(b.tsize);
// if(pos==0)
            //applet.println(pos,i,j);
            if(w2.init)b.setPos( 10 + colwidth * j,
            10 + (rowheight+b.tsize) * i);
            b.y = b.by - s.value+20;
            
            b.mouse = mouse;
            //b.highlight(mouse);
            b.draw(canvas1);
            b.textbtm = true;
            
            b.yoff = -20;
            b.parentCanvas = true;
            if(!b.textcheck)b.labelcheck(colwidth);
//            
            boolean k = b.pos(mouse);
            b.set = true;
            //if(b.visible)
            if(k&&b.submenu!=null&&track.size()<1){
              int size = currentp.length();
              if(currentp.charAt(size-1)!='\\')currentp += "\\";
              currentl = currentp + b.blabel;
            }
            else if(k&&b.submenu==null){
              int size = currentp.length();
              if(currentp.charAt(size-1)!='\\')currentp += "\\";
              currentf = currentp + b.blabel;
            }
            if(k&&theme.dclick&&b1.submenu!=null&&!smdown&&track.size()<1){
              int size = currentp.length();
              if(currentp.charAt(size-1)!='\\')currentp += "\\";
              back = currentp;
              currentp += b.blabel;
              forward = currentp;
              Window w1 = new Window(w2.x+200,w2.y,w,h,currentp,Bms);
              windows.add(w1);
              windex = 0;
              s.value = 0;
              s.valuex = 0;
              wid = windows.size()-1;
              smdown = true;
              currentFolder = currentf;
            }
            else if(k&&theme.dclick&&b1.submenu==null&&!smdown&&track.size()<1){
              int size = currentp.length();
              if(currentp.charAt(size-1)!='\\')currentp += "\\";
              String file = currentp + b.blabel;
              currentf = file;
              currentLink = currentf;
              //if(launchable)launch(file);
              smdown = true;
            }
            if(k)counter++;
// // rect
          }
          }}
      w2.init = true;
    }
    buttonHover = counter>0;
    if(!applet.mousePressed)smdown = false;
  };
  
};

```

this is where the problem occurs

```auto
 if(open||firstRun||buttonHover) {
      canvas1.beginDraw();
      canvas1.background(255,0);
      //canvas1.fill(theme.windowfillcol,theme.windowtransparency/40);
      canvas1.noStroke();
      //if(firstRun||buttonHover)canvas1.rect(0,0,w,h,r1,r2,r3,r4);
    }

```

I’m guessing this might be a complex issue to solve, if there is no solution I’ll have to remove the transparency for android, but it just seems a shame.

android

 ![Screenshot_20211003_102801_processing.test.sketch_210928a](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/b9d0aa3874199b8e5c6c5217db1bbe23a647bd6f.jpeg)

windows

 ![2021-10-03 10_37_08-sketch_210928a](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/1/1f465589ec8d93bd38c41d667d4d93b61f7ac284.jpeg)

as you can see yes there is transparency in android, but each time i scroll it stacks on top of the previous draw, again the windows version doesnt have this problem.

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 5, 2021, 6:37pm UTC](https://discourse.processing.org/t/android-transparency-and-windows-transparency/32574/2 "2021-10-05T18:37:39Z")

</div>

fixed I had forgotten to add P2D in the createGraphics method.

 ![Screenshot_20211005_191514_processing.test.sketch_210928a](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/3ab0293f76d1cefe509354487cbae4631f8601d1.jpeg)

incidently this caused the canvas to display using incorrect proportions not sure why, as I have made use of this method before for the tabs, and yet I did not have similar problems.

here is the windows code

```auto
if(!w2.init)
            b.setPos( 10 + colwidth * j,
            10 + (rowheight+b.tsize) * i);
            b.y = b.by - s.value+20;

```

here is the android code

```auto
if(!w2.init)
            b.setPos( 10 + (colwidth+5) * j,
            10 + (rowheight-b.h) * i);
            b.y = b.by - s.value+rowheight*2;

```

note the y values make use of different values and the mouse PVector is also different

windows

```auto
public PVector getMouse() {
		float a = 0;
		if(sliders.get(0)!=null)a = sliders.get(0).value;
		return new PVector(applet.mouseX-x,applet.mouseY-y+a);
	};

```

android

```auto
public PVector getMouse() {
		float a = 0;
		if(sliders.get(0)!=null)a = sliders.get(0).value;
		return new PVector(applet.map(applet.mouseX-x,0,w*2,0,w),applet.map(applet.mouseY-y+h-rowheight,0,h*2,0,h));
	};

```

note the use of map, to make sure the mouse is located where the finger is touching.

Again this is not an issue in the tab class, so I am unsure what the problem is exactly.

In any case the problem is solved, despite the fact that I’m not entirely satisfied with this solution. However I thought I’d document the findings in case anybody also came across this problem.

So as we can see transparency fixed, and theme manager complete.

ok so not quite complete

strokeSize seems to cause framerate issues, not sure why.

Shall test further to find the problem

 ![Screenshot_20211005_193427_processing.test.sketch_210928a](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/1/1baa81ffe9f69e09ddb07bdab0f27254050196c9.jpeg)  
 ![Screenshot_20211005_193518_processing.test.sketch_210928a](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/52ac2ff99f1579812ce34f784b22f50d5c64568b.jpeg)