- Notifications
You must be signed in to change notification settings - Fork29.7k
Closed
Labels
P1High-priority issues at the top of the work lista: platform-viewsEmbedding Android/iOS views in Flutter appse: web_canvaskitCanvasKit (a.k.a. Skia-on-WebGL) rendering backend for Webengineflutter/engine related. See also e: labels.found in release: 2.2Found to occur in 2.2found in release: 2.3Found to occur in 2.3has reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-webWeb applications specificallyr: fixedIssue is closed as already fixed in a newer version
Description
Flutter UI becomes Choppy whenever i resize the browser window.
iframe element is intially placed inside row and when the size of the window is reduced horizontally it is changed to column while changing to column to row and vice-versa. The Flutter UI becomes choppy as it leaves lot of duplicated UI on the screen.
Steps to Reproduce: Run the below code and resize the browser window horizontally.
Below is the sample code:
minimal code sample
import'dart:html'as html;import'dart:ui'as ui;import'package:flutter/material.dart';voidmain() {runApp(MyApp());}classMyAppextendsStatelessWidget {// This widget is the root of your application.@overrideWidgetbuild(BuildContext context) {returnMaterialApp( title:'Flutter Demo', theme:ThemeData( primarySwatch:Colors.blue, ), home:MyHomePage(), ); }}classMyHomePageextendsStatefulWidget {MyHomePage({Key? key}):super(key: key);@override_MyHomePageStatecreateState()=>_MyHomePageState();}class_MyHomePageStateextendsState<MyHomePage> {@overridevoidinitState() {super.initState(); }var _iframeWidget=HtmlElementView( key:UniqueKey(), viewType:'column', );@overrideWidgetbuild(BuildContext context) {print(' build called');var re= ui.platformViewRegistry.registerViewFactory('column', (int viewId) { html.IFrameElement _iframeElement= html.IFrameElement() ..slot="column" ..src='https://www.youtube.com/embed/D_mCZlQZg9Y' ..style.width='100%' ..style.height='100%';print('plat');return _iframeElement; }, );returnScaffold( appBar:AppBar( title:Text('Demo'), ), body:Center( child:Container( height:400, width:500, child:MediaQuery.of(context).size.width<800?Row( children: [Container(width:300, height:200, child: _iframeWidget),Text('Some text') ], ):Column( children: [Container(width:300, height:200, child: _iframeWidget),Text('Some text') ], ), ),// This trailing comma makes auto-formatting nicer for build methods. ), ); }}
Metadata
Metadata
Assignees
Labels
P1High-priority issues at the top of the work lista: platform-viewsEmbedding Android/iOS views in Flutter appse: web_canvaskitCanvasKit (a.k.a. Skia-on-WebGL) rendering backend for Webengineflutter/engine related. See also e: labels.found in release: 2.2Found to occur in 2.2found in release: 2.3Found to occur in 2.3has reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-webWeb applications specificallyr: fixedIssue is closed as already fixed in a newer version