Question

我正在使用UPDATE picture_tag ptag SET tag_id = (SELECT id FROM duplicate_stuff ds WHERE ds.name = (SELECT LOWER(tag) FROM tag WHERE id = ds.id) AND id = (SELECT id FROM tag WHERE id = ds.id) ORDER BY ds.countyCo DESC LIMIT 1 ) WHERE ptag.tag_id IN (SELECT id FROM duplicate_stuff)小部件的transform属性将其绕Z轴旋转，就是这样：

Container

在以下代码段中：

transform: Matrix4.rotationZ(10 * pi/180)

如何更改旋转点并将其设置为Scaffold( resizeToAvoidBottomInset: false, body: Stack( children: <Widget>[ Container( // margin: EdgeInsets.symmetric(vertical: 20.0,horizontal: 10.0), decoration: BoxDecoration( image: DecorationImage( image: AssetImage( "assets/img/women.png", ), fit: BoxFit.scaleDown, ), ), ), SingleChildScrollView( child: Container( width: deviceSize.width, height: deviceSize.height, child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: <Widget>[ Flexible( child: Container( margin: EdgeInsets.only(bottom: 90.0), padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 15), transform: Matrix4.rotationZ(10 * pi / 180) ..translate(10.0), decoration: BoxDecoration( borderRadius: BorderRadius.circular(25), color: Colors.orange, boxShadow: [ BoxShadow( blurRadius: 20.0, color: Colors.orange, offset: Offset(5, 7), ) ], ), child: Text( 'Shopping Universe', style: TextStyle( color: Colors.white, fontSize: 60.0, fontFamily: 'Piedra', fontWeight: FontWeight.w200, ), ), ), ), Flexible( child: AuthCard(), ), ], ), ), ), ], ), );的{{1}}？

此后，我可以使用翻译重新定位它，类似center of gravity

但是我对这种方法不满意，

有人可以帮我吗？

任何建议都将不胜感激。谢谢。

Answer 1

您可以使用Container小部件包装Transform并将origin属性设置为所需的任何内容。

如果您希望origin位于Container的中心，则必须执行类似origin: Offset(containerWidth/2, containerHeight/2)的操作。

并且由于您的Container没有特定的高度（仅宽度与父级相同），您必须找到其大小。您可以使用RenderBox。 Here您可以找到有关如何实现此目标的教程。

import 'package:flutter/material.dart';
import 'auth_card.dart';
import 'dart:math' as Math;

class Test extends StatefulWidget {
  @override
  _TestState createState() => _TestState();
}

class _TestState extends State<Test> {
  GlobalKey _containerKey = GlobalKey();
  Size _containerSize = Size(0, 0);

  @override
  void initState() {
    WidgetsBinding.instance.addPostFrameCallback(_afterLayout);
    super.initState();
  }

  Size _getSize() {
    final RenderBox renderBoxRed =
    _containerKey.currentContext.findRenderObject();
    return renderBoxRed.size;
  }

  _afterLayout(_) {
    _containerSize = _getSize();
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    Size deviceSize = MediaQuery.of(context).size;
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Stack(
        children: <Widget>[
          Container(

//            margin: EdgeInsets.symmetric(vertical: 20.0,horizontal: 10.0),
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage(
                  "assets/img/women.png",
                ),
                fit: BoxFit.scaleDown,
              ),
            ),
          ),
          SingleChildScrollView(
            child: Container(
              width: deviceSize.width,
              height: deviceSize.height,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Flexible(
                    child: Transform(
                      transform: Matrix4.rotationZ(10 * Math.pi / 180),
                      origin: Offset(
                          _containerSize.width / 2, _containerSize.height / 2),
                      child: Container(
                        key: _containerKey,
                        margin: EdgeInsets.only(bottom: 20.0),
                        padding: EdgeInsets.symmetric(
                            vertical: 20.0, horizontal: 15),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(25),
                          color: Colors.orange,
                          boxShadow: [
                            BoxShadow(
                              blurRadius: 20.0,
                              color: Colors.orange,
                              offset: Offset(5, 7),
                            )
                          ],
                        ),
                        child: Text(
                          'Shopping Universe',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 60.0,
                            fontFamily: 'Piedra',
                            fontWeight: FontWeight.w200,
                          ),
                        ),
                      ),
                    ),
                  ),
                  Flexible(
                    child: AuthCard()
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

但请注意：

设置原点等效于通过平移将变换矩阵缀合。提供此属性只是为了方便。

Flutter-如何更改Container小部件的旋转点？

1 个答案: