Inside the build method 👇🏽
Widget build(BuildContext context) {
final provider = Provider.of<StateProvider>(context, listen: false);
// Get the selected question details from the StateProvider
final selectedQuestion = provider.selectedQuestion;
// Check if the question is disabled
final bool isQuestionDisabled = selectedQuestion['isActive'];
return Scaffold(
resizeToAvoidBottomInset: true,
appBar: AppBar(
leading: IconButton(
icon: SvgPicture.asset('assets/icons/left_arrow.svg'),
onPressed: () {
Navigator.pushNamedAndRemoveUntil(
context,
Provider.of<StateProvider>(context, listen: false).selectedRoute,
(route) => false, // Remove all routes in the stack
);
},
),
actions: const [
Padding(
padding: EdgeInsets.symmetric(horizontal: 20),
child: Text(
'+3 Guidos online',
style: TextStyle(
color: Color(0xFF00FF38),
fontSize: 10,
fontWeight: FontWeight.w400),
),
)
],
),
body: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
padding: const EdgeInsets.only(top: 8),
color: const Color(0xFF191919),
child: questions(
selectedQuestion['title'],
selectedQuestion['description'],
selectedQuestion['tags'][0],
selectedQuestion['priority'],
selectedQuestion['timeLeft'].toString(),
),
),
Expanded(
child: RefreshIndicator(
onRefresh: _reloadChatMessages,
child: Stack(
alignment: Alignment.bottomCenter,
children: [
Align(
alignment: Alignment.bottomCenter,
child: Image.asset(
'assets/images/community.png',
height: 306,
),
),
const Align(
alignment: Alignment.topCenter,
child: Padding(
padding:
EdgeInsets.symmetric(vertical: 20, horizontal: 50),
child: Text(
'Help out your peer Exploro and earn rewards',
style: TextStyle(
color: Color(0xFF818181),
fontSize: 16,
fontWeight: FontWeight.w600),
textAlign: TextAlign.center,
),
),
),
ListView.builder(
padding: EdgeInsets.symmetric(horizontal: 5),
reverse: true,
itemCount: _messages.length + 1,
itemBuilder: (context, index) {
if (index == 0) {
return _isRefreshing
? Container(
height: 80.0,
child: Center(
child: CircularProgressIndicator(),
),
)
: SizedBox.shrink();
} else {
final message = _messages[index - 1];
final firebaseUser = FirebaseAuth.instance.currentUser;
final userUid = firebaseUser?.uid ?? '';
final isUserMessage = message['user'] == userUid;
return isUserMessage
? SendMesage(
proPic: message['profileImage'],
text: message['type'] == 'LOCATION'
? ''
: message['message'],
time: _formatTimestamp(message['timestamp']),
type: message['type'],
isSentByUser: isUserMessage,
coordinates: message['type'] == 'LOCATION'
? message['message']
: {},
)
: IncomingMessage(
text: message['type'] == 'LOCATION'
? ''
: message['message'],
time: _formatTimestamp(message['timestamp']),
proPic: message['profileImage'],
type: message['type'],
iseSentByUser: isUserMessage,
coordinates: message['type'] == 'LOCATION'
? message['message']
: {},
user: message['user'],
);
}
},
),
],
),
),
),
if (isQuestionDisabled)
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Expanded(
child: TextField(
onTapOutside: (event) {
print('onTapOutside');
FocusManager.instance.primaryFocus?.unfocus();
},
controller: _messageController,
maxLength: 200, // Set max length
maxLengthEnforcement: MaxLengthEnforcement.enforced,
decoration: InputDecoration(
hintText: 'Message',
filled: true,
fillColor: const Color(0xFF2A2A2A),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(100),
borderSide: BorderSide.none,
),
contentPadding: const EdgeInsets.symmetric(
vertical: 10,
horizontal: 20,
),
),
),
),
IconButton(
icon: SvgPicture.asset('assets/icons/up_arrow.svg'),
onPressed: _sendMessage,
),
IconButton(
icon: const Icon(Icons.attach_file),
onPressed: () {
showModalBottomSheet(
elevation: 0,
context: context,
builder: (builder) => AttachmentBottomSheet(
loadMessages: _loadChatMessages));
},
),
],
),
)
],
),
bottomNavigationBar: isQuestionDisabled
? BottomAppBar(
child: Container(
height: 56.0,
child: Center(
child: Text(
'Session Ended',
style: TextStyle(
color: Colors.white, fontWeight: FontWeight.bold),
),
),
),
)
: Padding(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
CustomTextButton(
text: 'Report',
onPressed: () {
showModalBottomSheet(
elevation: 0,
context: context,
builder: (build) => reportSheet());
},
borderRadius: BorderRadius.circular(24),
backgroundColor: Colors.transparent,
borderColor: const Color(0xFF0C8CE9),
padding: const EdgeInsets.symmetric(
horizontal: 10,
),
),
CustomTextButton(
text: 'Quit',
onPressed: () {
Navigator.of(context).popUntil((route) => route.isFirst);
},
backgroundColor: const Color(0xFFFF5050),
borderRadius: BorderRadius.circular(24),
padding: const EdgeInsets.symmetric(horizontal: 20),
)
],
),
),
);
}
bottomNavigationBar works with the condition isQuestionDisabled but,
if (isQuestionDisabled)
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Expanded(
child: TextField(
onTapOutside: (event) {
print('onTapOutside');
FocusManager.instance.primaryFocus?.unfocus();
},
controller: _messageController,
maxLength: 200, // Set max length
maxLengthEnforcement: MaxLengthEnforcement.enforced,
decoration: InputDecoration(
hintText: 'Message',
filled: true,
fillColor: const Color(0xFF2A2A2A),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(100),
borderSide: BorderSide.none,
),
contentPadding: const EdgeInsets.symmetric(
vertical: 10,
horizontal: 20,
),
),
),
),
IconButton(
icon: SvgPicture.asset('assets/icons/up_arrow.svg'),
onPressed: _sendMessage,
),
IconButton(
icon: const Icon(Icons.attach_file),
onPressed: () {
showModalBottomSheet(
elevation: 0,
context: context,
builder: (builder) => AttachmentBottomSheet(
loadMessages: _loadChatMessages));
},
),
],
),
)
this always works opposite for the given value. Above row should disappear for
isQuestionDisabled == true
Confused why the rendering is working for
() ? value1 : value2
but not for
if ()
It seems like there's an issue with the conditional rendering inside the build method. This should correctly render the UI based on the value of isQuestionDisabled, however there might be another issue elsewhere in the code 😕