GSI - Employe Self Service Mobile
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

178 lines
4.7 KiB

2 months ago
  1. import 'package:flutter/material.dart';
  2. class Background extends StatelessWidget {
  3. const Background({Key? key}) : super(key: key);
  4. @override
  5. Widget build(BuildContext context) {
  6. return Scaffold(
  7. resizeToAvoidBottomInset: false,
  8. backgroundColor: Colors.white,
  9. body: Column(
  10. children: <Widget>[
  11. new Stack(
  12. alignment: Alignment.bottomCenter,
  13. children: <Widget>[
  14. WavyHeader()
  15. ],
  16. ),
  17. Expanded(
  18. child: Container(),
  19. ),
  20. Stack(
  21. alignment: Alignment.bottomLeft,
  22. children: <Widget>[
  23. WavyFooter(),
  24. CirclePink(),
  25. CircleYellow(),
  26. ],
  27. )
  28. ],
  29. ),
  30. );
  31. }
  32. }
  33. const List<Color> orangeGradients = [
  34. /*Color(0xFFFF9844),
  35. Color(0xFFFE8853),
  36. Color(0xFFFD7267),*/
  37. Color(0xFFD21404),
  38. Color(0xFFFD7267)
  39. ];
  40. const List<Color> aquaGradients = [
  41. Color(0xFF8EF7DA),
  42. Color(0xFF5AEAF1),
  43. Colors.blueAccent,
  44. ];
  45. class WavyHeader extends StatelessWidget {
  46. @override
  47. Widget build(BuildContext context) {
  48. return ClipPath(
  49. clipper: TopWaveClipper(),
  50. child: Container(
  51. decoration: BoxDecoration(
  52. gradient: LinearGradient(
  53. colors: orangeGradients,
  54. begin: Alignment.topLeft,
  55. end: Alignment.center),
  56. ),
  57. height: MediaQuery.of(context).size.height / 2.5,
  58. ),
  59. );
  60. }
  61. }
  62. class WavyFooter extends StatelessWidget {
  63. @override
  64. Widget build(BuildContext context) {
  65. return ClipPath(
  66. clipper: FooterWaveClipper(),
  67. child: Container(
  68. decoration: BoxDecoration(
  69. gradient: LinearGradient(
  70. colors: aquaGradients,
  71. begin: Alignment.center,
  72. end: Alignment.bottomRight),
  73. ),
  74. height: MediaQuery.of(context).size.height / 3,
  75. ),
  76. );
  77. }
  78. }
  79. class CirclePink extends StatelessWidget {
  80. @override
  81. Widget build(BuildContext context) {
  82. return Transform.translate(
  83. offset: Offset(-70.0, 90.0),
  84. child: Material(
  85. color: Color(0xFFFF9844),
  86. child: Padding(padding: EdgeInsets.all(120)),
  87. shape: CircleBorder(side: BorderSide(color: Colors.white, width: 15.0)),
  88. ),
  89. );
  90. }
  91. }
  92. class CircleYellow extends StatelessWidget {
  93. @override
  94. Widget build(BuildContext context) {
  95. return Transform.translate(
  96. offset: Offset(0.0, 210.0),
  97. child: Material(
  98. color: Colors.yellow,
  99. child: Padding(padding: EdgeInsets.all(140)),
  100. shape: CircleBorder(side: BorderSide(color: Colors.white, width: 15.0)),
  101. ),
  102. );
  103. }
  104. }
  105. class TopWaveClipper extends CustomClipper<Path> {
  106. @override
  107. Path getClip(Size size) {
  108. // This is where we decide what part of our image is going to be visible.
  109. var path = Path();
  110. path.lineTo(0.0, size.height);
  111. var firstControlPoint = new Offset(size.width / 7, size.height - 30);
  112. var firstEndPoint = new Offset(size.width / 6, size.height / 1.5);
  113. path.quadraticBezierTo(firstControlPoint.dx, firstControlPoint.dy,
  114. firstEndPoint.dx, firstEndPoint.dy);
  115. var secondControlPoint = Offset(size.width / 5, size.height / 4);
  116. var secondEndPoint = Offset(size.width / 1.5, size.height / 5);
  117. path.quadraticBezierTo(secondControlPoint.dx, secondControlPoint.dy,
  118. secondEndPoint.dx, secondEndPoint.dy);
  119. var thirdControlPoint =
  120. Offset(size.width - (size.width / 9), size.height / 6);
  121. var thirdEndPoint = Offset(size.width, 0.0);
  122. path.quadraticBezierTo(thirdControlPoint.dx, thirdControlPoint.dy,
  123. thirdEndPoint.dx, thirdEndPoint.dy);
  124. ///move from bottom right to top
  125. path.lineTo(size.width, 0.0);
  126. ///finally close the path by reaching start point from top right corner
  127. path.close();
  128. return path;
  129. }
  130. @override
  131. bool shouldReclip(CustomClipper<Path> oldClipper) => false;
  132. }
  133. class FooterWaveClipper extends CustomClipper<Path> {
  134. @override
  135. Path getClip(Size size) {
  136. var path = Path();
  137. path.moveTo(size.width, 0.0);
  138. path.lineTo(size.width, size.height);
  139. path.lineTo(0.0, size.height);
  140. path.lineTo(0.0, size.height - 60);
  141. var secondControlPoint = Offset(size.width - (size.width / 6), size.height);
  142. var secondEndPoint = Offset(size.width, 0.0);
  143. path.quadraticBezierTo(secondControlPoint.dx, secondControlPoint.dy,
  144. secondEndPoint.dx, secondEndPoint.dy);
  145. return path;
  146. }
  147. @override
  148. bool shouldReclip(CustomClipper<Path> oldClipper) => false;
  149. }
  150. class YellowCircleClipper extends CustomClipper<Rect> {
  151. @override
  152. Rect getClip(Size size) {
  153. throw UnimplementedError();
  154. }
  155. @override
  156. bool shouldReclip(CustomClipper<Rect> oldClipper) => false;
  157. }