Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – How can I resolve Error: The argument type 'Text' can't be assigned to the parameter type 'String'

I have this code snippetbelow

   body: SingleChildScrollView(
        padding: EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _buildDropdownField(
                Text(
              'Country*',
              style: TextStyle(color: Colors.white),)

            ),
           _buildDropdownField("City*"),
           _buildDropdownField("District*"),

I tried to change the color of first _buildDropdownField by using Text() but then I get this error:

64:17: Error: The argument type 'Text' can't be assigned to the parameter type 'String'.
 - 'Text' is from 'package:flutter/src/widgets/text.dart' ('../../../flutter/packages/flutter/lib/src/widgets/text.dart').
                Text(

How can I change the text color of plain text inside a widget like that ? Also I tried RichText() I got the same error.

here is _buildDropdownField

 Widget _buildDropdownField(String label) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 8.0),
      child: InputDecorator(
        decoration: InputDecoration(
          labelText: label,
          border: OutlineInputBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          filled: true,
          fillColor: Colors.white,
        ),
        child: DropdownButtonHideUnderline(
          child: DropdownButton<String>(
            value: null,
            isExpanded: true,
            items: <String>['Option 1', 'Option 2', 'Option 3'].map((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
            onChanged: (_) {},
            hint: Text('Dropdown menu'),
          ),
        ),
      ),
    );
  }
Tags:

2

Answers


  1. 0

    Your dropdown:

    Widget _buildDropdownField(String label) {
  return Padding(
    padding: ...

    Is expecting a String, but your passing in:

    _buildDropdownField(
                Text(
              'Country*',
              style: TextStyle(color: Colors.white),)

    a Text widget.

    If you want to modify the text color, you should do it on as a property for the Text widget.

    For example:

    accept an optional style:

    Widget _buildDropdownField(String label, {TextStyle? style}) {
  return Padding(

    and use it:

    return DropdownMenuItem<String>(
              value: value,
              child: Text(value, style: style ?? TextStyle()),
            );

    Complete runnable snippet:

    import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Material App Bar'),
        ),
        body: Center(
            child: _buildDropdownField('red',
                style: TextStyle(color: Colors.red))),
      ),
    );
  }
}

Widget _buildDropdownField(String label, {TextStyle? style}) {
  return Padding(
    padding: const EdgeInsets.symmetric(vertical: 8.0),
    child: InputDecorator(
      decoration: InputDecoration(
        labelText: label,
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8.0),
        ),
        filled: true,
        fillColor: Colors.white,
      ),
      child: DropdownButtonHideUnderline(
        child: DropdownButton<String>(
          value: null,
          isExpanded: true,
          items:
              <String>['Option 1', 'Option 2', 'Option 3'].map((String value) {
            return DropdownMenuItem<String>(
              value: value,
              child: Text(value, style: style ?? TextStyle()),
            );
          }).toList(),
          onChanged: (_) {},
          hint: Text('Dropdown menu'),
        ),
      ),
    ),
  );
}

    Result:

    enter image description here

    Note: you are doing passing in:

    child: DropdownButton<String>(
          value: null,
          isExpanded: true,

    null to the value, so, you won’t actually be able to select anything…

    Login or Signup to reply.
  2. 0

    Here is your fix for your widget method

    body: SingleChildScrollView(
  padding: EdgeInsets.all(16.0),
  child: Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      _buildDropdownField(
        Text(
          'Country*',
          style: TextStyle(color: Colors.white), // Set text color here
        ),
      ),
      _buildDropdownField("City*"),
      _buildDropdownField("District*"),
    ],
  ),
),

Widget _buildDropdownField(Widget label) { // Use Widget instead of String
  return Padding(
    padding: const EdgeInsets.symmetric(vertical: 8.0),
    child: InputDecorator(
      decoration: InputDecoration(
        labelText: label is Text ? label.data : label.toString(), // Handle both Text and String types
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8.0),
        ),
        filled: true,
        fillColor: Colors.white,
      ),
      child: DropdownButtonHideUnderline(
        child: DropdownButton<String>(
          value: null,
          isExpanded: true,
          items: <String>['Option 1', 'Option 2', 'Option 3'].map((String value) {
            return DropdownMenuItem<String>(
              value: value,
              child: Text(value),
            );
          }).toList(),
          onChanged: (_) {},
          hint: Text('Dropdown menu'),
        ),
      ),
    ),
  );
}

    But efficent way to handle this scenario is having a resuable method which accept text:string, color: Color as arguments and have default color within method.

     Widget _buildDropdownField(String label, {Color fillColor= Colors.black}) {
       return Padding(
      padding: const EdgeInsets.symmetric(vertical: 8.0),
      child: InputDecorator(
        decoration: InputDecoration(
          labelText: label,
          border: OutlineInputBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          filled: true,
          fillColor: fillColor,
        ),
        child: DropdownButtonHideUnderline(
          child: DropdownButton<String>(
            value: null,
            isExpanded: true,
            items: <String>['Option 1', 'Option 2', 'Option 3'].map((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
            onChanged: (_) {},
            hint: Text('Dropdown menu'),
          ),
        ),
      ),
    );

   }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search