বিড়ম্বনা: কীভাবে হিন্ট টেক্সট দিয়ে কোনও টেক্সটফিল্ড তৈরি করবেন তবে কোনও আন্ডারলাইন নেই?


116

এটি আমি তৈরি করার চেষ্টা করছি:

এখানে চিত্র বর্ণনা লিখুন

পাঠ্য ক্ষেত্রগুলির জন্য ফ্লার্ট ডক্সগুলিতে ( https://flutter.io/text-input/ ) এতে বলা হয়েছে যে আপনি সজ্জাতে যাওয়ার মাধ্যমে আন্ডারলাইনটি সরাতে পারেন null। তবে এটি ইঙ্গিত পাঠ্য থেকে মুক্তিও পায় rid

আমি পাঠ্য ক্ষেত্রটি ফোকাসযুক্ত কিনা তা কোনও আন্ডারলাইন চাই না।

আপডেট: 2020 এপ্রিল হিসাবে ফ্লটার এসডিকে পরিবর্তনগুলি প্রতিবিম্বিত করতে আপডেট হওয়া গৃহীত উত্তর।

উত্তর:


78

ওয়েব এবং ডেস্কটপ সমর্থনের একীকরণের পরে উপরের উত্তরের কোনও উত্তরই নতুন ফ্লাটার এসডিকে কাজ করবে যেহেতু আপনাকে আলাদা আলাদাভাবে এটি নির্দিষ্ট করতে হবে

TextFormField(
    cursorColor: Colors.black,
    keyboardType: inputType,
    decoration: new InputDecoration(
        border: InputBorder.none,
        focusedBorder: InputBorder.none,
        enabledBorder: InputBorder.none,
        errorBorder: InputBorder.none,
        disabledBorder: InputBorder.none,
        contentPadding:
            EdgeInsets.only(left: 15, bottom: 11, top: 11, right: 15),
        hintText: sLabel),
  )

232

এটা এভাবে করো:

TextField(
  decoration: new InputDecoration.collapsed(
    hintText: 'Username'
  ),
),

বা আইকন যেমন আপনার অন্যান্য জিনিস প্রয়োজন হয়, সঙ্গে সীমানা সেট InputBorder.none

InputDecoration(
    border: InputBorder.none,
    hintText: 'Username',
  ),
),

materialপ্যাকেজ আমদানি না করে এটি করা কি সম্ভব ? অর্থাত্ Cupertinoথিমের জন্য ?
কোসিয়ারা - বার্টোস্ কোসারজেকি

আমি এড়াতে চাই: InputDecoration' can't be assigned to the parameter type 'BoxDecoration'টাইপ ত্রুটি
কোসিয়ারা - বার্তোস কোসারজিকি

13

ফোকাস করা সীমানাটি কোনওটিতেই পরিবর্তন করবেন না

TextField(
      decoration: new InputDecoration(
          border: InputBorder.none,
          focusedBorder: InputBorder.none,
          contentPadding: EdgeInsets.only(left: 15, bottom: 11, top: 11, right: 15),
          hintText: 'Subject'
      ),
    ),

12

এখানে একটি পরিপূরক উত্তর যা কিছু পূর্ণ কোড দেখায়:

এখানে চিত্র বর্ণনা লিখুন

  Container(
    decoration: BoxDecoration(
      color: Colors.tealAccent,
      borderRadius:  BorderRadius.circular(32),
    ),
    child: TextField(
      decoration: InputDecoration(
        hintStyle: TextStyle(fontSize: 17),
        hintText: 'Search your trips',
        suffixIcon: Icon(Icons.search),
        border: InputBorder.none,
        contentPadding: EdgeInsets.all(20),
      ),
    ),
  ),

মন্তব্য:

  • গা dark় পটভূমি (কোড দেখানো হয়নি) হয় Colors.teal
  • InputDecorationএছাড়াও একটি filledএবং fillColorসম্পত্তি আছে, কিন্তু আমি তাদের একটি কোণার ব্যাসার্ধ পেতে না পারে, তাই আমি পরিবর্তে একটি ধারক ব্যবহার।

3

আমি খুঁজে পেলাম যে অন্য কোনও উত্তর সীমানা ব্যাসার্ধ দেয় না, আপনি কেবল এটির মতো এটি করতে পারেন, কোনও নেস্টেড নেই Container

  TextField(
    decoration: InputDecoration(
      border: OutlineInputBorder(
        borderSide: BorderSide.none,
        borderRadius: BorderRadius.circular(20),
      ),
    ),
  );

-1

আমি TextFieldফ্লটার নিয়ন্ত্রণ ব্যবহার করছিলাম below নীচের পদ্ধতিগুলি ব্যবহার করে আমি ব্যবহারকারী টাইপ করা ইনপুট পেয়েছি।

onChanged:(value){
}

-2
decoration: InputDecoration(
 border:OutLineInputBorder(
 borderSide:BorderSide.none
 bordeRadius: BordeRadius.circular(20.0)
 )
)

এই উত্তর এবং @ ই এর মধ্যে পার্থক্য কী এক মাস আগে থেকে সনের উত্তর ?
জেরেমি কেনে

আপনি কিছু নতুন চান?
এসআর কেশব

2
যদি ইতিমধ্যে উত্তর সরবরাহ করা হয়ে থাকে তবে তা আর জমা দেওয়ার দরকার নেই। এটি করা ভবিষ্যতের পাঠকদের জন্য কেবল গোলমাল যুক্ত করে, কারণ তাদের একাধিক অনুরূপ উত্তরের মাধ্যমে বাছাই করা দরকার। ভবিষ্যতে, একবার আপনি আরও খানিকটা খ্যাতি অর্জন করার পরে, আপনি বিদ্যমান উত্তরগুলিকে উজ্জীবিত করতে সক্ষম হবেন; এটি একটি পদ্ধতির বৈধতা দেওয়ার এবং সমাধানটি কাজ করে তা নিশ্চিত করার পছন্দের উপায়।
জেরেমি

1
আমার মনে রাখা উচিত, উপলক্ষে, অবদানকারীরা এখনও তাদের অনুরূপ ব্যাখ্যা দেওয়ার মতো অন্য পদ্ধতি থাকলে বা যথেষ্ট আরও বিশদ যুক্ত করতে চান তবে তারা অনুরূপ পরামর্শ পোস্ট করবেন । পুরোপুরি ঠিক আছে। এখানে সমস্যাটি হ'ল আপনি একই উত্তরটি সরবরাহ করছেন বলে মনে হচ্ছে তবে কম বিশদ সহ, সুতরাং এটি থ্রেডে খুব বেশি অবদান রাখে না।
জেরেমি কেনে
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.