let blackBoard: Graphics | null = null;
const createBlackBoard=()=>{
  const container = new Container();

  const newBlackboard = new Graphics()
      .roundRect(0, 0, width, height/2,80)
      .fill({
        color: 'white',
        alpha: 1,
      });
  container.addChild(newBlackboard);
  container.position.set(
      0  ,
      300
  );

  app.stage.addChild(container);
  blackBoard=newBlackboard
}

const createBlackBoardText=()=>{


  const html = new HTMLText({
    text: '<textarea id="output" rows="6" cols="50" readonly>asdasdsadsadsa</textarea>',
    style: {
      fontFamily: 'Arial',
      fontSize: 24,
      fill: '#ff1010',
      align: 'center',
    },
  });
  blackBoard.addChild(html)
}


const creatBackGround=()=>{
  const container = new Container();

  const background = new Graphics()
      .rect(0, 0, width, height)
      .fill({
          fill:gradient,
          color: 'yellow',
          alpha: 0.5,
        });
  container.addChild(background);
  container.position.set(
      0  , // 居中（宽度一半）
      0
  );

  container.addChild(background);
  app.stage.addChild(container); // 直接添加到舞台
}