Skip to content

Commit e5181ea

Browse files
Yuvaraj-GajarajYuvaraj-Gajaraj
committed
New samples added
2 parents 0eb1215 + 29f2d2c commit e5181ea

File tree

2 files changed

+195
-0
lines changed

2 files changed

+195
-0
lines changed

‎lib/samples/gauge/animation/radial_easeanimation.dart

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
import 'package:flutter_examples/model/sample_view.dart';
2+
import 'package:syncfusion_flutter_gauges/gauges.dart';
3+
import 'package:flutter/foundation.dart';
4+
import 'package:flutter/material.dart';
5+
6+
//ignore: must_be_immutable
7+
class RadialEaseExample extends SampleView {
8+
const RadialEaseExample(Key key) : super(key: key);
9+
10+
@override
11+
_RadialEaseExampleState createState() => _RadialEaseExampleState();
12+
}
13+
14+
class _RadialEaseExampleState extends SampleViewState {
15+
_RadialEaseExampleState();
16+
17+
@override
18+
Widget build(BuildContext context) {
19+
return getRadialEaseExample();
20+
}
21+
22+
23+
SfRadialGauge getRadialEaseExample() {
24+
return SfRadialGauge(
25+
axes: <RadialAxis>[
26+
RadialAxis(
27+
startAngle: 0,
28+
endAngle: 360,
29+
showLabels: false,
30+
showTicks: false,
31+
radiusFactor: kIsWeb ? 0.8 : 0.9,
32+
axisLineStyle: AxisLineStyle(
33+
thicknessUnit: GaugeSizeUnit.factor,
34+
thickness: isCardView ? 0.07 : 0.1)),
35+
RadialAxis(
36+
startAngle: 170,
37+
endAngle: 170,
38+
showTicks: false,
39+
labelFormat: '{value}M',
40+
showAxisLine: false,
41+
radiusFactor: kIsWeb ? 0.8 : 0.9,
42+
minimum: 0,
43+
maximum: 15,
44+
showLastLabel: false,
45+
axisLabelStyle: GaugeTextStyle(
46+
fontSize: isCardView ? 10 : 12, fontWeight: FontWeight.w500),
47+
labelOffset: 25,
48+
interval: isCardView ? 1 : _interval,
49+
canRotateLabels: true,
50+
annotations: <GaugeAnnotation>[
51+
GaugeAnnotation(
52+
positionFactor: 1,
53+
axisValue: 0,
54+
widget: Container(
55+
height: isCardView ? 30 : 45,
56+
width: isCardView ? 30 : 45,
57+
decoration: const BoxDecoration(
58+
image: DecorationImage(
59+
image: ExactAssetImage('images/shotput.png'),
60+
fit: BoxFit.fitHeight,
61+
),
62+
))),
63+
GaugeAnnotation(
64+
widget: Container(
65+
child: const Text('Distance', style: TextStyle(fontSize: 20)),
66+
))
67+
],
68+
pointers: <GaugePointer>[
69+
RangePointer(
70+
value: 11.5,
71+
width: 0.1,
72+
color: const Color(0xFFF67280),
73+
enableAnimation: true,
74+
sizeUnit: GaugeSizeUnit.factor,
75+
animationType: AnimationType.ease,
76+
gradient: kIsWeb
77+
? null
78+
: const SweepGradient(
79+
colors: <Color>[Color(0xFFFFB397), Color(0xFFF46AA0)],
80+
stops: <double>[0.25, 0.75]),
81+
),
82+
kIsWeb
83+
? MarkerPointer(
84+
value: 11.5,
85+
markerType: MarkerType.circle,
86+
enableAnimation: true,
87+
animationType: AnimationType.ease,
88+
color: Colors.blue,
89+
markerHeight: isCardView ? 30 : 40,
90+
markerOffset: 4,
91+
markerWidth: isCardView ? 30 : 40)
92+
: MarkerPointer(
93+
value: 11.5,
94+
markerType: MarkerType.image,
95+
enableAnimation: true,
96+
animationType: AnimationType.ease,
97+
imageUrl: 'images/ball.png',
98+
markerHeight: isCardView ? 30 : 40,
99+
markerOffset: 4,
100+
markerWidth: isCardView ? 30 : 40)
101+
])
102+
],
103+
);
104+
}
105+
106+
final double _interval = 1;
107+
}

‎lib/samples/gauge/animation/radial_slowmiddle.dart

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
import 'package:flutter_examples/model/sample_view.dart';
2+
import 'package:syncfusion_flutter_gauges/gauges.dart';
3+
import 'package:flutter/material.dart';
4+
import 'package:flutter/foundation.dart';
5+
6+
//ignore: must_be_immutable
7+
class RadialSlowMiddleAnimation extends SampleView {
8+
const RadialSlowMiddleAnimation(Key key) : super(key: key);
9+
10+
@override
11+
_RadialSlowMiddleAnimationState createState() =>
12+
_RadialSlowMiddleAnimationState();
13+
}
14+
15+
class _RadialSlowMiddleAnimationState extends SampleViewState {
16+
_RadialSlowMiddleAnimationState();
17+
18+
@override
19+
Widget build(BuildContext context) {
20+
return getRadialSlowMiddleAnimation();
21+
}
22+
23+
SfRadialGauge getRadialSlowMiddleAnimation() {
24+
return SfRadialGauge(
25+
axes: <RadialAxis>[
26+
RadialAxis(
27+
radiusFactor: kIsWeb ? 0.85 : 0.95,
28+
startAngle: 270,
29+
endAngle: 270,
30+
showAxisLine: false,
31+
ticksPosition: ElementsPosition.outside,
32+
labelsPosition: ElementsPosition.outside,
33+
minimum: 0,
34+
maximum: 12,
35+
interval: 1,
36+
canRotateLabels: true,
37+
majorTickStyle: MajorTickStyle(
38+
length: 0.15, lengthUnit: GaugeSizeUnit.factor, thickness: 1.5),
39+
minorTicksPerInterval: 4,
40+
showFirstLabel: false,
41+
axisLabelStyle: GaugeTextStyle(fontSize: 12),
42+
minorTickStyle: MinorTickStyle(
43+
length: 0.07, lengthUnit: GaugeSizeUnit.factor, thickness: 1.5),
44+
pointers: <GaugePointer>[
45+
NeedlePointer(
46+
needleLength: 0.95,
47+
needleStartWidth: 0,
48+
lengthUnit: GaugeSizeUnit.factor,
49+
needleEndWidth: 5,
50+
needleColor: const Color(0xFFC06C84),
51+
knobStyle: KnobStyle(knobRadius: 0),
52+
value: 11,
53+
enableAnimation: true,
54+
animationType: AnimationType.slowMiddle),
55+
NeedlePointer(
56+
needleLength: 0.7,
57+
needleStartWidth: 0,
58+
lengthUnit: GaugeSizeUnit.factor,
59+
needleEndWidth: 5,
60+
needleColor: const Color(0xFFF67280),
61+
value: 2,
62+
enableAnimation: true,
63+
animationType: AnimationType.slowMiddle,
64+
knobStyle: KnobStyle(
65+
color: const Color(0xFFF67280),
66+
sizeUnit: GaugeSizeUnit.logicalPixel,
67+
knobRadius: 10),
68+
),
69+
NeedlePointer(
70+
needleLength: 0.8,
71+
needleStartWidth: 1,
72+
lengthUnit: GaugeSizeUnit.factor,
73+
needleEndWidth: 1,
74+
needleColor: _slowMiddleNeedleColor,
75+
knobStyle: KnobStyle(
76+
knobRadius: 5,
77+
sizeUnit: GaugeSizeUnit.logicalPixel,
78+
color: _slowMiddleNeedleColor),
79+
value: 10.4,
80+
enableAnimation: true,
81+
animationType: AnimationType.slowMiddle),
82+
])
83+
],
84+
);
85+
}
86+
87+
final Color _slowMiddleNeedleColor = const Color(0xFF355C7D);
88+
}

0 commit comments

Comments
 (0)