Я хочу сделать такую кнопку, но не получаю желаемого результата
Я хочу создать поле и кнопку текстовой формы внутри контейнера, и при нажатии кнопки текст в форме должен быть скопирован в буфер обмена. Как я могу этого добиться?Мое требование такое
Container(
height: 65.0,
width: 270.0,
child: Row(
children: <Widget>[
Expanded(
child: TextField(
decoration: InputDecoration(
hintText: "https://",
border: OutlineInputBorder(
borderRadius:
BorderRadius
.circular(10.0),
borderSide:
BorderSide()))),
),
Container(
child: FlatButton(
onPressed: () {},
child: Text("Copy Link")),
)
],
),
)
3 ответа
Решение
Вам нужно научиться достигать двух вещей, это то, чего вы хотите, это =>
- Класс буфера обмена => Который копирует буфер обмена. Кроме того, импортируйте это
import 'package:flutter/services.dart';
в вашем файле, чтобы использовать этот классsuffixIcon
вInputDecoration
, который добавит элемент в конец внутри вашегоTextField()
ОКОНЧАТЕЛЬНОЕ РЕШЕНИЕ:
// mandatory for Clipboard class
import `'package:flutter/services.dart';
class _MyHomePageState extends State<MyHomePage> {
final key = new GlobalKey<ScaffoldState>();
final TextEditingController _controller = new TextEditingController();
@override
Widget build(BuildContext context){
return Scaffold(
key: key,
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Container(
height: 65.0,
width: 270.0,
child: TextField(
controller: _controller,
decoration: InputDecoration(
hintText: "https://",
suffixIcon: FlatButton(
onPressed: () {
// Here what you have to do the operation using Clipboard
Clipboard.setData(new ClipboardData(text: _controller.text.toString()));
key.currentState.showSnackBar(
new SnackBar(content: new Text("Copied to Clipboard")));
},
child: Text("Copy Link")
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10.0),
borderSide: BorderSide()
)
)
)
)
),
);
}
}
РЕЗУЛЬТАТ:
Дайте мне знать, если это вам поможет:) Удачного обучения!!
Вам нужно добавить границу к Container
а не Textfield
Container(
height: 50.0,
width: 270.0,
decoration: BoxDecoration(
border: Border.all(
color: Colors.grey,
),
borderRadius: BorderRadius.circular(10.0),
),
child: Row(
children: <Widget>[
Expanded(
child: TextField(
decoration: InputDecoration(
contentPadding: EdgeInsets.only(left: 10.0),
hintText: "https://",
border: InputBorder.none,
),
),
),
Container(
height: 50.0,
decoration: BoxDecoration(
border: Border.all(
color: Colors.grey,
),
borderRadius: BorderRadius.circular(6.0),
),
child: FlatButton(onPressed: () {}, child: Text("Copy Link")),
),
],
),
)
Попробуй это:
Container(
height: 65.0,
width: 270.0,
decoration: BoxDecoration(
border: Border.all(),
borderRadius: BorderRadius.circular(20.0)),
child: Row(
children: <Widget>[
Expanded(
child: TextField(
decoration: InputDecoration(
border: InputBorder.none,
hintText: "https://")),
),
Container(
child: FlatButton(
onPressed: () {},
child: Text("Copy Link")),
)
],
),
)
);
это даст