Skip to content

Commit 174bc72

Browse files
toly1994328toly1994328
committed
优化折叠面板代码
1 parent aefa59f commit 174bc72

File tree

1 file changed

+99
-84
lines changed

1 file changed

+99
-84
lines changed

‎lib/components/project/widget_node_panel.dart‎

Lines changed: 99 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import '../permanent/code/highlighter_style.dart';
1313

1414
/// create by 张风捷特烈 on 2020-04-13
1515
/// contact me by email [email protected]
16-
/// 说明:
16+
/// 说明: 一个Widget的知识点对应的界面
1717
1818
class WidgetNodePanel extends StatefulWidget {
1919
final String text;
@@ -23,81 +23,33 @@ class WidgetNodePanel extends StatefulWidget {
2323
final HighlighterStyle codeStyle;
2424
final String codeFamily;
2525

26-
WidgetNodePanel({this.text, this.subText, this.code, this.show,this.codeStyle,this.codeFamily});
26+
WidgetNodePanel(
27+
{this.text,
28+
this.subText,
29+
this.code,
30+
this.show,
31+
this.codeStyle,
32+
this.codeFamily});
2733

2834
@override
2935
_WidgetNodePanelState createState() => _WidgetNodePanelState();
3036
}
3137

32-
class _WidgetNodePanelState extends State<WidgetNodePanel>
33-
with SingleTickerProviderStateMixin {
34-
bool _showCode = false;
35-
38+
class _WidgetNodePanelState extends State<WidgetNodePanel> {
3639
var _crossFadeState = CrossFadeState.showFirst;
3740

3841
bool get isFirst => _crossFadeState == CrossFadeState.showFirst;
3942

43+
Color get themeColor => Theme.of(context).primaryColor;
44+
4045
@override
4146
Widget build(BuildContext context) {
4247
return Container(
4348
margin: EdgeInsets.all(10),
4449
child: Column(
4550
crossAxisAlignment: CrossAxisAlignment.center,
4651
children: <Widget>[
47-
Row(
48-
children: <Widget>[
49-
Padding(
50-
padding: const EdgeInsets.symmetric(horizontal: 8),
51-
child: Circle(
52-
color: Theme.of(context).primaryColor,
53-
radius: 5,
54-
),
55-
),
56-
Expanded(
57-
child: Text(
58-
'${widget.text}',
59-
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
60-
),
61-
),
62-
FeedbackWidget(
63-
mode: FeedMode.fade,
64-
a: 0.4,
65-
onPressed: () async {
66-
// await Clipboard.setData(ClipboardData(text: widget.code));
67-
// Toast.toast(context, '复制成功!');
68-
Share.share(widget.code);
69-
},
70-
child: Padding(
71-
padding: const EdgeInsets.only(
72-
right: 10,
73-
),
74-
child: Icon(
75-
TolyIcon.icon_share,
76-
size: 20,
77-
color: Theme.of(context).primaryColor,
78-
),
79-
),
80-
),
81-
Padding(
82-
padding: const EdgeInsets.only(right: 10.0),
83-
child: ToggleRotate(
84-
durationMs: 300,
85-
child: Icon(
86-
TolyIcon.icon_code,
87-
color: Theme.of(context).primaryColor,
88-
),
89-
onTap: () {
90-
setState(() {
91-
_crossFadeState = _showCode
92-
? CrossFadeState.showFirst
93-
: CrossFadeState.showSecond;
94-
_showCode = !_showCode;
95-
});
96-
},
97-
),
98-
)
99-
],
100-
),
52+
buildNodeTitle(),
10153
SizedBox(
10254
height: 20,
10355
),
@@ -106,34 +58,97 @@ class _WidgetNodePanelState extends State<WidgetNodePanel>
10658
padding: const EdgeInsets.only(top: 10, bottom: 20),
10759
child: widget.show,
10860
),
109-
Container(
110-
width: double.infinity,
111-
child: Panel(
112-
child: Text(
113-
'${widget.subText}',
114-
style: TextStyle(fontSize: 14),
115-
)),
116-
),
61+
_buildNodeInfo(),
11762
Divider(),
11863
],
11964
),
12065
);
12166
}
12267

68+
Widget buildNodeTitle() => Row(
69+
children: <Widget>[
70+
Padding(
71+
padding: const EdgeInsets.symmetric(horizontal: 8),
72+
child: Circle(
73+
color: themeColor,
74+
radius: 5,
75+
),
76+
),
77+
Expanded(
78+
child: Text(
79+
'${widget.text}',
80+
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
81+
),
82+
),
83+
_buildShareButton(),
84+
_buildCodeButton()
85+
],
86+
);
87+
88+
Widget _buildNodeInfo() => Container(
89+
width: double.infinity,
90+
child: Panel(
91+
child: Text(
92+
'${widget.subText}',
93+
style: TextStyle(fontSize: 14),
94+
)),
95+
);
96+
97+
Widget _buildCodeButton() => Padding(
98+
padding: const EdgeInsets.only(right: 10.0),
99+
child: ToggleRotate(
100+
durationMs: 300,
101+
child: Icon(
102+
TolyIcon.icon_code,
103+
color: themeColor,
104+
),
105+
onTap: _toggleCodePanel,
106+
),
107+
);
108+
109+
Widget _buildShareButton() => FeedbackWidget(
110+
mode: FeedMode.fade,
111+
a: 0.4,
112+
onPressed: _doShare,
113+
child: Padding(
114+
padding: const EdgeInsets.only(
115+
right: 10,
116+
),
117+
child: Icon(
118+
TolyIcon.icon_share,
119+
size: 20,
120+
color: themeColor,
121+
),
122+
),
123+
);
124+
123125
Widget _buildCode(BuildContext context) => AnimatedCrossFade(
124-
firstCurve: Curves.easeInCirc,
125-
secondCurve: Curves.easeInToLinear,
126-
firstChild: Container(),
127-
secondChild: Container(
128-
width: MediaQuery.of(context).size.width,
129-
child: CodeWidget(
130-
fontFamily: widget.codeFamily,
131-
code: widget.code,
132-
style: widget.codeStyle??HighlighterStyle.fromColors(
133-
HighlighterStyle.lightColor),
134-
),
135-
),
136-
duration: Duration(milliseconds: 500),
137-
crossFadeState: _crossFadeState,
138-
);
139-
}
126+
firstCurve: Curves.easeInCirc,
127+
secondCurve: Curves.easeInToLinear,
128+
firstChild: Container(),
129+
secondChild: Container(
130+
width: MediaQuery.of(context).size.width,
131+
child: CodeWidget(
132+
fontFamily: widget.codeFamily,
133+
code: widget.code,
134+
style: widget.codeStyle ??
135+
HighlighterStyle.fromColors(HighlighterStyle.lightColor),
136+
),
137+
),
138+
duration: Duration(milliseconds: 500),
139+
crossFadeState: _crossFadeState,
140+
);
141+
142+
//执行分享
143+
_doShare() {
144+
Share.share(widget.code);
145+
}
146+
147+
// 折叠代码面板
148+
_toggleCodePanel() {
149+
setState(() {
150+
_crossFadeState =
151+
!isFirst ? CrossFadeState.showFirst : CrossFadeState.showSecond;
152+
});
153+
}
154+
}

0 commit comments

Comments
 (0)