Prática de desenvolvimento de Flutter - obtenha o tamanho e a posição do widget

Prática de desenvolvimento de Flutter - obtenha o tamanho e a posição do widget

No processo de desenvolvimento recente, é necessário obter o tamanho e a posição do Widget, neste momento é necessário utilizar GlobalKey e WidgetsBinding.instance.addPostFrameCallback.

Por exemplo, addPostFrameCallback

O que esta função faz:

O componente de interface Widget em flutter renderiza cada quadro na interface, e a função addPostFrameCallback deve chamar de volta e executar o método personalizado após cada quadro ser desenhado

Por exemplo, após a conclusão do desenho, de acordo com o tamanho e posição do Widget obtido

@override
  void initState() {
    
    
    // TODO: implement initState
    super.initState();

    WidgetsBinding.instance?.addPostFrameCallback((timeStamp) {
    
    
      if (mounted) {
    
    
        updateElementFrame();
      }
    });
  }

2. Chave Global

GlobalKey pode nos ajudar convenientemente a obter o status, tamanho e posição do widget especificado e também pode ser usado para chamar o método do widget especificado.
Frequentemente usado em chamadas de widget pai-filho: https://blog.csdn.net/gloryFlow/article/details/131960753

Aqui GlobalKey é usado para obter o tamanho e a posição.

código mostrado abaixo

void updateElementFrame() {
    
    
    if (mounted) {
    
    
      GlobalKey globalKey = widget.key as GlobalKey;
      if (globalKey.currentContext != null) {
    
    
        RenderBox renderBox =
        globalKey.currentContext!.findRenderObject() as RenderBox;
        // offset.dx , offset.dy 就是控件的左上角坐标
        Offset offset = renderBox.localToGlobal(Offset.zero);
        //获取size
        Size size = renderBox.size;
      }
    }
  }

3. Resumo

Prática de desenvolvimento de Flutter - obtenha o tamanho e a posição do widget. Precisa usar GlobalKey e WidgetsBinding.instance.addPostFrameCallback.Registros
de aprendizagem, continue melhorando a cada dia.