Godot-Android-Samples
Godot-Android-Samples copied to clipboard
Godot View does not respect layout in flutter android app and always sticks to the top of the screen
I am trying to embed Godot view in my flutter android app. Here is the complete source code
Flutter allows embedding native views. Check here for more info
I am able to embed my godot
view properly in my flutter
app, but the issue is it always sticks at the top and hide other flutter
contents.
Check below video to know what i am talking about
https://github.com/m4gr3d/Godot-Android-Samples/assets/142881488/b50ecd90-89c8-4c68-acfc-dff764f9059b
As you can see in the video, first i had two flutter Text
at the top and at the bottom. Once the Godot
view loads it completely occupies the First text, there is a Positioned
widget from flutter as well which is kind of like position: absolute
property from css
and the Godot
view does not respect that as well. Also if you check my code i have specifically set the size of my framelayout which also does not work and the Godot view occupies the entire height of 1200 which i had set in my Godot project. The same thing works in Jetpack compose by setting framelayout height manually.
Here is a snippet of my code
My native view in flutter
class MyQrView(
context: Context, id: Int, creationParams: Map<String?, Any?>?,
private val activity: FlutterFragmentActivity
) : PlatformView {
private val linearLayout: LinearLayout
private val frameLayout: FrameLayout
override fun getView(): View {
return linearLayout
}
override fun dispose() {}
init {
linearLayout = LinearLayout(context)
linearLayout.layoutParams = ViewGroup.LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT
)
frameLayout = FrameLayout(context)
frameLayout.id = View.generateViewId()
linearLayout.addView(frameLayout)
frameLayout.apply {
frameLayout.layoutParams.height = 300
val fragmentTransaction = activity.supportFragmentManager.beginTransaction()
fragmentTransaction.replace(frameLayout.id, GodotFragment())
fragmentTransaction.commit()
}
}
}
To use it in flutter i use something like this
class MyHomePage extends StatelessWidget {
const MyHomePage({super.key});
@override
Widget build(BuildContext context) {
var width = MediaQuery.of(context).size.width;
var height = MediaQuery.of(context).size.height;
return Scaffold(
body: SafeArea(
child: Column(
children: [
Text(
"Hello from flutter",
style: TextStyle(fontSize: 20),
),
Positioned(
top: 100,
child: SizedBox(
width: width,
height: height / 1.5,
child: MyQrView(),
),
),
Text(
"Hello from flutter",
style: TextStyle(fontSize: 20),
),
],
),
),
);
}
}
The column widget in flutter helps to layout views on below the other which the Godot view does not respect. I have created multiple platforms views previously for android using flutter and have never faced such problem. This seems like a Godot issue to me than a flutter issue. Correct me if i am wrong