在 Flutter 中剪辑后删除多余的部分

Remove extra part after clipping in Flutter(在 Flutter 中剪辑后删除多余的部分)
本文介绍了在 Flutter 中剪辑后删除多余的部分的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

剪辑允许我只绘制我想要显示的部分.怎么去掉多余的部分没有画出来但还是占空间?

Clipping allows me to draw only the part which I want to show. How do I remove the extra part which is not drawn but still takes up space?

代码

import 'package:flutter/material.dart';

class ClipTut extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Row(
          children: <Widget>[
            ClipRect(
              clipper: CustomRect(),
              child: Container(
                decoration: BoxDecoration(
                  border: Border.all(width: 4, color: Colors.black),
                  color: Colors.blue,
                ),
                width: 200.0,
                height: 200.0,
              ),
            ),
            Container(
              height: 200,
              width: 100,
              decoration: BoxDecoration(
                border: Border.all(width: 4, color: Colors.black),
                color: Colors.green,
              ),
            )
          ],
        ),
      ),
    );
  }
}

class CustomRect extends CustomClipper<Rect> {
  @override
  Rect getClip(Size size) => Rect.fromLTRB(0, 0.0, size.width/2, size.height);

  @override
  bool shouldReclip(CustomRect oldClipper) => true;
}

推荐答案

我的解决方案

我最近遇到了类似的问题(我需要将图像剪成两半)并在 flutter api 站点(使用其他对齐点来改变切片行为)- 没有多余的空间:

My Solution

I had a similar problem recently (I needed to clip the image in half) and found this sample code on the flutter api site (use the other alignment points to change slicing behaviors) - no extra space left over:

ClipRect(
  child: Align(
    alignment: Alignment.topCenter,
    heightFactor: 0.5,
    child: Image.network(userAvatarUrl),
  ),
)

这篇关于在 Flutter 中剪辑后删除多余的部分的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

How to target newer versions in .gitlab-ci.yml using auto devops (java 11 instead of 8 and Android 31 instead of 29)(如何在.gitlab-ci.yml中使用自动开发工具(Java 11而不是8,Android 31而不是29)瞄准较新的版本)
Android + coreLibraryDesugaring: which Java 11 APIs can I expect to work?(Android+core LibraryDesugering:我可以期待哪些Java 11API能够工作?)
How to render something in an if statement React Native(如何在If语句中呈现某些内容Reaction Native)
How can I sync two flatList scroll position in react native(如何在本机Reaction中同步两个平面列表滚动位置)
Using Firebase Firestore in offline only mode(在仅脱机模式下使用Firebase FiRestore)
Crash on Google Play Pre-Launch Report: java.lang.NoSuchMethodError(Google Play发布前崩溃报告:java.lang.NoSuchMethodError)