আমি কীভাবে এর রঙ পরিবর্তন করতে পারি CircularProgressIndicator
?
রঙের মান একটি উদাহরণ Animation<Color>
, তবে আমি আশা করছি যে অ্যানিমেশনটির ঝামেলা ছাড়াই রঙ পরিবর্তন করার সহজ উপায় আছে।
আমি কীভাবে এর রঙ পরিবর্তন করতে পারি CircularProgressIndicator
?
রঙের মান একটি উদাহরণ Animation<Color>
, তবে আমি আশা করছি যে অ্যানিমেশনটির ঝামেলা ছাড়াই রঙ পরিবর্তন করার সহজ উপায় আছে।
উত্তর:
এটি আমার পক্ষে কাজ করেছে:
valueColor: new AlwaysStoppedAnimation<Color>(Colors.blue),
The argument type 'AlwaysStoppedAnimation<Color>' can't be assigned to the parameter type 'Animation<Color>'
1) valueColor
সম্পত্তি ব্যবহার
CircularProgressIndicator(
valueColor: new AlwaysStoppedAnimation<Color>(Colors.blue),
),
2) accentColor
আপনার প্রধান MaterialApp
উইজেট সেট করুন ।
এটি সর্বোত্তম উপায় কারণ আপনি যখন CircularProgressIndicator
উইজেট ব্যবহার করেন আপনি সমস্ত সময় রঙ সেট করতে চান না
MaterialApp(
title: 'My App',
home: MainPAge(),
theme: ThemeData(accentColor: Colors.blue),
),
3) Theme
উইজেট ব্যবহার করে
Theme(
data: Theme.of(context).copyWith(accentColor: Colors.red),
child: new CircularProgressIndicator(),
)
accentColor
উইজেটগুলির অগ্রভাগের রঙের জন্য ব্যবহার করা যেতে পারে t এটির সাথে কোনও ফোরগ্রাউন্ড উইজেট সহ রঙ পরিবর্তন করে circularprogressbar
আপনি এটি ব্যবহার করতে পারেন:
void main() => runApp(
MaterialApp(
title: 'Demo App',
home: MainClass(),
theme: ThemeData(accentColor: Colors.black),
),
);
একটি থিম এমন একটি উইজেট যা আপনি আপনার উইজেট গাছের যে কোনও জায়গায় sertোকাতে পারেন। এটি কাস্টম মানগুলির সাথে বর্তমান থিমটিকে ওভাররাইড করে এটি ব্যবহার করে দেখুন:
new Theme(
data: Theme.of(context).copyWith(accentColor: Colors.yellow),
child: new CircularProgressIndicator(),
);
তথ্যসূত্র: https://gitter.im/flutter/flutter?at=5a84cf9218f388e626a51c2d
valueColor:new AlwaysStoppedAnimation<Color>(Colors.yellow),
ডিফল্টরূপে, এটি থেমেডাটা থেকে অ্যাকসেন্ট কালার উত্তরাধিকার সূত্রে প্রাপ্ত
void main() => runApp(new MaterialApp(
theme: ThemeData(
primaryColor: Colors.blue,
accentColor: Colors.blueAccent,
//This will be the color for CircularProgressIndicator color
),
home: Homepage()
));
আপনি আপনার নতুন রঙের সাথে এই অ্যাকসেন্টার রঙের সম্পত্তিটি পরিবর্তন করতে পারেন। অন্য উপায়ে এর মতো পূর্বনির্ধারিত থিমডাটা ব্যবহার করা হচ্ছে
void main() => runApp(new MaterialApp(
theme: ThemeData.light().copyWith(
accentColor: Colors.blueAccent,
//change the color for CircularProgressIndicator color here
),
home: Homepage()
));
অথবা অন্যথায় আপনি নীচে দেখানো হিসাবে সরাসরি এই রঙের সম্পত্তিটি বিজ্ঞপ্তিপ্রোগ্রেস ইন্ডিকেটরে পরিবর্তন করতে পারেন
CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
),
ইন main.dart
থিম সেট accentColor
, CircularProgressIndicator
যে রঙ ব্যবহার করা হবে
void main() => runApp(new MaterialApp(
theme: ThemeData(primaryColor: Colors.red, **accentColor: Colors.yellowAccent**),
debugShowCheckedModeBanner: false,
home: SplashPage()
));
একটি সিগল রঙ সেট জন্য,
CircularProgressIndicator(
valueColor:AlwaysStoppedAnimation<Color>(Colors.red),
);
বহু রঙ পরিবর্তন / সেট জন্য।
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
AnimationController animationController;
@override
void dispose() {
// TODO: implement dispose
super.dispose();
animationController.dispose();
}
@override
void initState() {
super.initState();
animationController =
AnimationController(duration: new Duration(seconds: 2), vsync: this);
animationController.repeat();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Color Change CircularProgressIndicator"),
),
body: Center(
child: CircularProgressIndicator(
valueColor: animationController
.drive(ColorTween(begin: Colors.brown, end: Colors.red)),
),
),
);
}
}