ස්ටැක් විජට් යනු ෆ්ලටර් එස්ඩීකේ හි ඇති බිල්ට් විජට් එකක් වන අතර එය එකිනෙක මත තැබීමෙන් විජට් තට්ටුවක් සෑදීමට අපට ඉඩ සලසයි. බොහෝ විට සරල පේළි සහ තීරු පිරිසැලසුම ප්‍රමාණවත් නොවේ, අපට එක් විජට් එකක් උඩින් තැබීමට ක්‍රමයක් අවශ්‍ය වේ, උදාහරණයක් ලෙස, අපට රූපයක් මත යම් පෙළක් පෙන්වීමට අවශ්‍ය විය හැකිය, එබැවින් එවැනි තත්වයක් විසඳීමට අපට තොගයක් තිබේ. විජට්. Stack widget හි දරුවන් වර්ග දෙකක් ඇත: එකක් ස්ථානගත කර ඇති අතර එය ස්ථානගත කරන ලද විජට් එකෙහි ඔතා ඇති අතර අනෙක ස්ථානගත නොවන විජට් එකෙහි ඔතා නොමැති ස්ථානගත කර ඇත. සියලුම ස්ථානගත නොවන විජට් සඳහා පෙළගැස්වීමේ ගුණය ඉහළ වම් කෙළවරට සකසා ඇත. ස්ථානගත කරන ලද ළමා විජට් ඉහළ, දකුණ, වම සහ පහළ ගුණාංග හරහා ස්ථානගත කර ඇත. Stack හි ළමා විජට් මුද්‍රණය කර ඇත්තේ ඉහළම විජට් තිරයේ පහළම විජට් බවට පත් වන පරිදි සහ අනෙක් අතට. අපට එම ඇණවුම වෙනස් කිරීමට හෝ වෙනත් ඇණවුමක් පැවරීමට Stack widget හි ප්‍රධාන ගුණාංගය භාවිතා කළ හැක.
Constructor of Stack Class:
Stack(
{Key key,
AlignmentGeometry alignment: AlignmentDirectional.topStart,
TextDirection textDirection,
StackFit fit: StackFit.loose,
Overflow overflow: Overflow.clip,
Clip clipBehavior: Clip.hardEdge,
List children: const []}
)
Properties of Stack Widget:
-
alignment: This property takes a parameter of Alignment Geometry, and controls how a child widget which is non-positioned or partially-positioned will be aligned in the Stack.
-
clipBehaviour: This property decided whether the content will be clipped or not.
-
fit: This property decided how the non-positioned children in the Stack will fill the space available to it.
-
overflow: This property controls whether the overflow part of the content will be visible or not,
-
textDirection: With this property, we can choose the text direction from right to left. or left to right.
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Apps lanka Dev'),
backgroundColor: Colors.greenAccent[400],
), //AppBar
body: Center(
child: SizedBox(
width: 300,
height: 300,
child: Center(
child: Stack(
children: [
Container(
width: 300,
height: 300,
color: Colors.red,
), //Container
Container(
width: 250,
height: 250,
color: Colors.black,
), //Container
Container(
height: 200,
width: 200,
color: Colors.purple,
), //Container
], //[]
), //Stack
), //Center
), //SizedBox
) //Center
) //Scaffold
) //MaterialApp
);
}
0 Comments