Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

[web] IFrame is choppy when resizing window horizontally #85522

Closed
flutter/engine
#27294
Assignees
harryterkelsen
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
@jaikrishnachandrasekar

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

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

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions


    [8]ページ先頭

    ©2009-2025 Movatter.jp