Dart Handling the length after decimal point

eye-catchDart and Flutter
Sponsored links

How to show minimum digit after decimal point

If a value data type is double and printed, it includes a decimal point like 10.0. Sometimes, the decimal point is not necessary to show if the value after the decimal point is 0. On the other hand, the value after the decimal point is necessary if the value is 10.5 for example. How can we achieve this? The following way shows the value as the original value is.

final values = [
  0.0,
  1,
  -1.23456,
  123456.0,
];
for (final value in values) {
  print("$value\t: $value");
}
// 0.0     : 0.0
// 1       : 1
// -1.23456: -1.23456
// 123456.0: 123456.0

The solution is easy. Calculate if the truncated value is equal to the original value.

for (final value in values) {
  final isNotZero = (value - value.truncate()) != 0;
  print("$value\t: min number of digit: ${isNotZero ? value : value.toInt()}");
}
// 0.0     : min number of digit: 0
// 1       : min number of digit: 1
// -1.23456: min number of digit: -1.23456
// 123456.0: min number of digit: 123456

This is my first idea but we can write it simpler.

final isNotZero2 = value.truncateToDouble() != value;

If we want to make the code better rename the variable name. I think positive naming is better than negative naming. In this case, isZero is better than isNotZero… Hmm, but hasDecimalPlace is probably better.

Handling currency by NumberFormat

Show at most 2 digits after the decimal point

If we want to treat a value as currency, we can implement it in different ways. The previous way is not a good way for currency because it can show too many digits after the decimal point.
Let’s improve it here. The first way is to use NumberFormat. Let’s assume that the currency can have at most 2 digits after the decimal points.

for (final value in [...values, 10.50, -10.5, 10.00]) {
  print("$value\t: NumberFormat: ${new NumberFormat("0.##").format(value)}");
}
// 0.0     : NumberFormat: 0
// 1       : NumberFormat: 1
// -1.23456: NumberFormat: -1.23
// 123456.0: NumberFormat: 123456
// 10.5    : NumberFormat: 10.5
// -10.5   : NumberFormat: -10.5
// 10.0    : NumberFormat: 10

The format defines that the value can have at most 2 digits. If the value has less than 2 digits after the decimal point, the digits are omitted.

Show always 2 digits after the decimal point

However, it doesn’t suit if we want to show 2 digits after the decimal point.
In this case, we can use one of the predefined methods.

for (final value in [...values, 10.50, -10.5, 10.00]) {
  final currency = new NumberFormat.currency(name: "EUR", symbol: "€")
    .format(value);
  print("$value\t: currency: $currency");
}
// 0.0     : currency: €0.00
// 1       : currency: €1.00
// -1.23456: currency: -€1.23
// 123456.0: currency: €123,456.00
// 10.5    : currency: €10.50
// -10.5   : currency: -€10.50
// 10.0    : currency: €10.00

There are several methods for currency. In this example, Euro is specified and the number of digits after the decimal point is always 2. If the symbol is unnecessary to show, specify an empty string to symbol property.

Not show decimal places if it is integer

If we want to show 10 instead of 10.00, we need a different approach. We can apply the same logic here as the first one shown at the top of this article.

for (final value in [...values, 10.50, 10.5, 10.00]) {
  final isZero = value.truncateToDouble() == value;
  print("$value\t: currency2: ${value.toStringAsFixed(isZero ? 0 : 2)}");
}
// 0.0     : currency2: 0
// 1       : currency2: 1
// -1.23456: currency2: -1.23
// 123456.0: currency2: 123456
// 10.5    : currency2: 10.50
// 10.5    : currency2: 10.50
// 10.0    : currency2: 10

It shows the value without decimal point if it is an integer value, otherwise 2 digits.

Difference between toStringAsPrecision and toStringAsFixed

We used toStringAsFixed method above. Since there is a similar method toStringAsPrecision, let’s check the difference.

for (final value in values) {
  print("$value\t: toStringAsPrecision: ${value.toStringAsPrecision(4)}");
}
// 0.0     : toStringAsPrecision: 0.000
// 1       : toStringAsPrecision: 1.000
// -1.23456: toStringAsPrecision: -1.235
// 123456.0: toStringAsPrecision: 1.235e+5

for (final value in values) {
  print("$value\t: toStringAsFixed: ${value.toStringAsFixed(4)}");
}
// 0.0     : toStringAsFixed: 0.0000
// 1       : toStringAsFixed: 1.0000
// -1.23456: toStringAsFixed: -1.2346
// 123456.0: toStringAsFixed: 123456.0000

toStringAsPrecision returns only 4 digits. It defines valid digits. Even if the value has many digits, it might not be precise. toStringAsPrecision is used to in this case to show only precise value.
On the other hand, toStringAsFixed is used if we always want to show fixed length after the decimal point.

Related articles

Comments

Copied title and URL