颤振:如何使ClipRect居中和fitWidth

时间:2019-01-26 09:21:04

标签: dart flutter

我正在使用ClipRect来显示图像的特殊部分。这是我的代码:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Demo'),
      debugShowCheckedModeBanner: false,
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ClipRect(
          clipper: CustomRect(),
          child: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage('man_face.jpg'),
                fit: BoxFit.fitWidth,
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class CustomRect extends CustomClipper<Rect> {
  @override
  Rect getClip(Size size) {
    double x = 50.0;
    double y = 300.0;
    double w = 130.0;
    double h = 80.0;

    Rect rect = Rect.fromLTRB(x, y, x + w, y + h);
    return rect;
  }

  @override
  bool shouldReclip(CustomRect oldClipper) {
    return true;
  }
}

这是结果:https://imgur.com/a/1V69yX6

如何制作裁剪后的图像,居中和fitWidth?

类似这样的内容:https://imgur.com/a/p41y3nx

0 个答案:

没有答案