深度系统 - 之前的 'top' 项在更改时闪烁

Depth system - previous 'top' item flashes upon change

我正在尝试在处理过程中建立一个深度系统。 目标是使其功能类似于 (Windows) window.

我有一个名为 'Window' 的 class,它可以接受一些参数,它会成功绘制一个可以拖动的 window。

深度系统现在可以正常工作。我无法点击 windows 'under' 当前的 window,如果我点击另一个 window,windows 的顺序会正确切换。

问题是每当我在windows之间切换时,之前选择的window闪烁(未绘制)一帧,然后再次出现。

我完全搞不懂为什么会这样。这是我的代码,如果您需要任何进一步的信息,请告诉我。

Windows.pde:

Window[] wins;
int win_count = 0;
boolean win_drag = false;
int win_selected = 2;

void setup()
{
  size(800, 600);
  wins = new Window[3];
  wins[0] = new Window("Test", 20, 20, 300, 200); 
  wins[1] = new Window("Test 2", 20, 260, 350, 225); 
  wins[2] = new Window("Test 3", 400, 20, 250, 150); 
}

void draw()
{
  background(10);

  for (int i = 0; i < wins.length; i ++)
  {
    wins[i].draw_window();
  }
}


void bringToTop(Window winID)
{
  Window[] new_wins;
  new_wins = new Window[wins.length];

  int win_pos = -1;

  for (int i = 0; i < wins.length; i ++)
  {
    if (wins[i] == winID)
    {
      win_pos = i;
      break;
    }
  }

  arrayCopy(wins, 0, new_wins, 0, win_pos);
  arrayCopy(wins, win_pos + 1, new_wins, win_pos, wins.length - win_pos - 1);
  new_wins[wins.length - 1] = winID;

  arrayCopy(new_wins, wins);
}


boolean isOnTop(Window winID)
{

  int win_pos = -1;

  for (int i = 0; i < wins.length; i ++)
  {
    if (wins[i] == winID)
    {
      win_pos = i;
      break;
    }
  }

  Window[] top_wins;
  top_wins = new Window[wins.length];
  int winTopCount = 0;

  for (int i = 0; i < wins.length; i ++)
  {
    if (mouse_in_rect(wins[i].winX, wins[i].winY, wins[i].winW, wins[i].winH + 24))
    {
      top_wins[winTopCount] = wins[i];
      winTopCount ++;
    }
  }

  int last_real_win = -1;

  for (int i = 0; i < top_wins.length; i ++)
  {

    if (top_wins[i] != null)
    {
      last_real_win = i;
    }
  }

  return (wins[win_pos] == top_wins[last_real_win]);
}

WindowObj.pde:

class Window
{
  String winT;
  int winX;
  int winY;
  int winW;
  int winH;

  boolean dragging;
  int winXOff;
  int winYOff;
  int winTH;
  int my_id;

  Window(String ttl, int WX, int WY, int WW, int WH)
  {
    winT = ttl;
    winX = WX;
    winY = WY;
    winW = WW;
    winH = WH;

    dragging = false;
    winXOff = 0;
    winYOff = 0;
    winTH = 24;
    my_id = win_count ++;
  }

  void draw_window()
  {
    if (win_selected == my_id)
    {
      fill(60);
    }
    else
    {
      fill(40);
    }
    rect(winX, winY, winW, winTH);

    fill(25);
    rect(winX, winY + 24, winW, winH);


    if (dragging == true)
    {
      winX = mouseX + winXOff;
      winY = mouseY + winYOff;


      if (winX < 0)
      {
        winX = 0;
      }

      if (winX > width - winW - 1)
      {
        winX = width - winW - 1;
      }


      if (winY < 0)
      {
        winY = 0;
      }

      if (winY > height - winH - winTH - 1)
      {
        winY = height - winH - winTH - 1;
      }

    }


    Window win_pos = wins[0];

    for (int i = 0; i < wins.length; i ++)
    {
      if (wins[i].my_id == my_id)
      {
        win_pos = wins[i];
      }
    }

    if (mouse_in_rect(winX, winY, winW, 24) && mousePressed && mouseButton == LEFT && dragging == false && isOnTop(win_pos) && win_drag == false)
    {
      dragging = true;
      winXOff = winX - mouseX;
      winYOff = winY - mouseY;
      win_drag = true;
      win_selected = my_id;
      bringToTop(win_pos);
    }


    if (mouse_in_rect(winX, winY + 24, winW, winH) && mousePressed && mouseButton == LEFT && dragging == false && isOnTop(win_pos) && win_drag == false)
    {
      win_selected = my_id;
      bringToTop(win_pos);
    }


    if (dragging == true)
    {
      if (mouseButton != LEFT)
      {
        win_drag = false;
        dragging = false;
        winXOff = 0;
        winYOff = 0;
      }
    }

  }



}

mouseFunctions.pde:

boolean mouse_in_rect(int mX, int mY, int mW, int mH)
{
  int but_x = mX;
  int but_y = mY;
  int but_w = mW;
  int but_h = mH;

  if (mouseX > but_x && mouseY > but_y && mouseX < but_x + but_w && mouseY < but_y + but_h)
  {
    return true;
  }
  else
  {
    return false;
  }
}

这个问题是因为你在一个循环中计算了window顺序和绘图。
如果awindow的位置改变了,awindow的绘制可能会被省略,而另一个window的绘制会被绘制两次。注意,数组 wins 中 windows 的索引已更改。

将 windows 的绘图和更新拆分为 2 个单独的方法:

class Window
{
    // ...

    void draw_window()
    {
        if (win_selected == my_id)
        {
          fill(60);
        }
        else
        {
          fill(40);
        }
        rect(winX, winY, winW, winTH);

        fill(25);
        rect(winX, winY + 24, winW, winH);
    }

    void update_window()
    {
       if (dragging == true)
       { 
          // ...
       }

       // ...
    }  

首先更新 windows 的顺序并计算其新位置。之后在一个单独的循环中绘制所有 windows:

void draw()
{
    background(10);

    for (int i = 0; i < wins.length; i ++) {
        wins[i].update_window();
    }

    for (int i = 0; i < wins.length; i ++) {
        wins[i].draw_window();
    }
}