How do I add a gradient to a TextField in Flutter?

Question

I'm just learning flutter. Is it possible to do this in textField ? I can't find it. Example

Answer 1

Yes it is possible You need to use 2 Containers

Container(
      child: Padding(
        padding: const EdgeInsets.all(
          1.0,
        ),
        child: Container(
          padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
          child: TextFormField(),
          decoration: AppColors.kInnerDecoration
              .copyWith(borderRadius: BorderRadius.circular(8.0)),
        ),
      ),
      decoration: AppColors.kGradientBoxDecoration.copyWith(
        borderRadius: BorderRadius.circular(10),
      ),
    )

static var kInnerDecoration = BoxDecoration(
    color: Colors.white,
    border: Border.all(color: Colors.white),
    borderRadius: BorderRadius.circular(30),
  );

  static var kGradientBoxDecoration = BoxDecoration(
    gradient: themeGradient,
    border: Border.all(
      color: AppColors.whiteColor,
    ),
    borderRadius: BorderRadius.circular(30),
  );

Output: