In the new_transaction.dart file which is where we defined these form elements,
we can also replace the text fields here with Cupertino text fields.
There are Cupertino text fields available and on these text fields, you can also set up a bunch
of things. You can set up a placeholder text, which would be your placement for the label text here in
input decoration,
there you don't assign, so on the Cupertino text field you don't assign a decoration input decoration
object but you directly have a placeholder argument which you can use to set a placeholder text.
And in general as always, if you hit control space, you get an overview over what you can set
and that's quite a lot here,
just as on the material text fields, you can set auto correction, a cursor color. In some details, like
the placeholder text,
there are differences but in many places, you can basically control these text fields just as you control
the text fields on material design.
I'll not implement it here though because I rather like that material design look and I want to have
it here in my iOS app too. For the button however, for the choose date button, we can use the Cupertino
button instead to see how we could do that.
So instead of that FlatButton, again we can use platform.isIOS and if that's true, I want to use
the CupertinoButton here and not the FlatButton.
Now important, Cupertino by default has that flat
look. Now here, I'm getting an error regarding platform and you also need to make sure to use the Cupertino
button that you import package:flutter/cupertino.dart into this file as well,
you need to import it into every file where you want to use Cupertino styled elements or widgets. And
to unlock the platform class, we need to import dart:io just as before.
Now we can use both
and now for the CupertinoButton here, you could set a color to add a background to this button if you
want to turn it from a FlatButton into a RaisedButton and now for this button here, we can add a child
and the onPressed listener,
we need both here on this CupertinoButton as well.
If I save this and I restart this app and we go back,
now here we have the Cupertino FlatButton.
Looks pretty similar to the FlatButton for Android but is the Cupertino one, as I can prove
if I go here on my CupertinoButton and I change the color temporarily to colors.blue,
if we do that, now you see we have a blue background here and that can be used as I said to also create
a button which has that RaisedButton look or that with background button look
which of course also have on iOS. Here however, I don't want to have that, I'll leave the default which
correctly infers the color of the text and yes, looks pretty similar but now is the CupertinoButton
which you can especially see if your tap on it, then instead of that ripple effect, it gets this opacity
which you used from iOS buttons.