Как мне увеличить размер контейнера, не влияя на макет?

#flutter #dart #mobile #flutter-layout

#flutter #dart #Мобильный #flutter-layout

Вопрос:

У меня есть эта пользовательская клавиатура: пользовательская клавиатура

Когда нажата клавиша, я хочу, чтобы она увеличивалась в размере, не влияя на положение других клавиш вокруг нее.

Клавиатура структурирована как таковая:

keyboard_key.dart:

 return GestureDetector(
  onTapDown: _handleOnTapDown,
  onTapUp: _handleOnTapUp,
  onTapCancel: _handleOnTapCancel,
  child: Container(
    height: keyHeight,
    width: keyWidth,
    margin: EdgeInsets.all(keySpacing),
    decoration: _boxDecoration(),
    child: Center(
      child: Text(
        letter,
        style: _textStyle(),
      ),
    ),
  ),
);
 

keyboard_row.дротик:

 return Container(
  child: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: rowLetters.split('').map<Widget>((String ch) {
      return KeyboardKey(ch);
    }).toList(),
  ),
);
 

keyboard.dart:

 return Container(
  padding: EdgeInsets.only(
    left: 1.0,
    right: 1.0,
    top: 8.0,
  ),
  child: Column(
    children: _rows.map<Widget>((row) => KeyboardRow(row)).toList(),
  ),
);
 

Ответ №1:

Вы можете использовать конструктор Transform.scale
Widget для масштабирования child Widget :

 // keyboard_key.dart
return GestureDetector(
  onTapDown: _handleOnTapDown,
  onTapUp: _handleOnTapUp,
  onTapCancel: _handleOnTapCancel,
  child: Transform.scale(
     scale: 1.5,
     child:
        Container(
          height: keyHeight,
          width: keyWidth,
          margin: EdgeInsets.all(keySpacing),
          decoration: _boxDecoration(),
          child: Center(
            child: Text(
              letter,
              style: _textStyle(),
       ),
     ),
   ),
);