408 lines
13 KiB
Dart
408 lines
13 KiB
Dart
import 'dart:async';
|
||
import 'package:flutter/cupertino.dart';
|
||
import 'package:flutter/material.dart';
|
||
import 'package:agora_rtc_engine/rtc_engine.dart';
|
||
import 'package:permission_handler/permission_handler.dart';
|
||
|
||
import 'package:will_play/utils/auth.dart';
|
||
import 'package:will_play/views/palRoom/PalRoom.dart';
|
||
import '../../utils/http_util.dart';
|
||
import '../../utils/settings.dart';
|
||
|
||
class CreateRoomPage extends StatefulWidget {
|
||
CreateRoomPage({Key? key}) : super(key: key);
|
||
|
||
@override
|
||
State<CreateRoomPage> createState() => _CreateRoomPageState();
|
||
}
|
||
|
||
class _CreateRoomPageState extends State<CreateRoomPage> {
|
||
final _formKey = GlobalKey<FormState>();
|
||
final _roomName = TextEditingController();
|
||
|
||
late RtcEngine _engine; // 声网实例变量
|
||
bool flag = false;
|
||
|
||
List patternList = [
|
||
RadioModel(
|
||
true,
|
||
'普通',
|
||
),
|
||
RadioModel(
|
||
false,
|
||
'相亲',
|
||
),
|
||
RadioModel(
|
||
false,
|
||
'拍卖',
|
||
),
|
||
RadioModel(
|
||
false,
|
||
'KTV',
|
||
),
|
||
];
|
||
|
||
List tagList = [
|
||
RadioModel(
|
||
true,
|
||
'交友',
|
||
),
|
||
RadioModel(
|
||
false,
|
||
'音乐',
|
||
),
|
||
RadioModel(
|
||
false,
|
||
'游戏',
|
||
),
|
||
RadioModel(
|
||
false,
|
||
'连麦聊',
|
||
),
|
||
];
|
||
|
||
late Timer timer; // 轮询定时器
|
||
late String roomName = _roomName.text; // 用户输入的房间名
|
||
late String roomId; // 创建接口根据用户输入的房间名，生成的房间唯一ID
|
||
|
||
void _create() {
|
||
MyHttpUtil()
|
||
.post("/chat/api/room/create", data: {"name": roomName}).then((res) {
|
||
roomId = res.data;
|
||
// print(roomId);
|
||
_agoraToken(roomId);
|
||
});
|
||
}
|
||
|
||
void _agoraToken(roomId) async {
|
||
var res = await MyHttpUtil().get("/chat/api/auth/agora/token",
|
||
data: {'channelName': roomId, 'role': 1});
|
||
|
||
var agoraToken = res.data["token"];
|
||
String uid = await Storage.get('id');
|
||
String userName = await Storage.get('userName'); // 用户名
|
||
|
||
_onJoin(agoraToken, userName, roomId, ClientRole.Broadcaster);
|
||
|
||
// Future.delayed(Duration(seconds: 3), () {
|
||
// _onJoin(agoraToken, userName, roomId, ClientRole.Broadcaster);
|
||
// });
|
||
|
||
// if (agoraToken != null && agoraToken.isNotEmpty) {
|
||
// _engine = await RtcEngine.create(APP_ID); // 初始化引擎
|
||
// _engine.joinChannel(agoraToken, roomId, null, int.parse(uid)); // 加入频道
|
||
|
||
// timer = Timer.periodic(Duration(seconds: 1), (timer) async {
|
||
// _lodingCreate(agoraToken);
|
||
// });
|
||
// }
|
||
}
|
||
|
||
void _lodingCreate(agoraToken) async {
|
||
var res = await MyHttpUtil().get("/chat/api/room/create/$roomId");
|
||
String userName = await Storage.get('userName'); // 用户名
|
||
print('_lodingCreate：${res.data}');
|
||
if (res.data == true) {
|
||
_onJoin(agoraToken, userName, roomId, ClientRole.Broadcaster);
|
||
timer.cancel();
|
||
}
|
||
}
|
||
|
||
@override
|
||
void dispose() {
|
||
super.dispose();
|
||
timer.cancel();
|
||
}
|
||
|
||
// 页面跳转方法：参数1：声网token；参数2：用户名； 参数3：频道名； 参数4：身份；
|
||
Future<void> _onJoin(agoraToken, userName, channelName, role) async {
|
||
await _handleCameraAndMic(Permission.camera);
|
||
await _handleCameraAndMic(Permission.microphone);
|
||
|
||
await Navigator.push(
|
||
context,
|
||
MaterialPageRoute(
|
||
builder: (context) => PalRoomPage(
|
||
agoraToken: agoraToken,
|
||
userName: userName,
|
||
channelName: channelName,
|
||
role: role,
|
||
),
|
||
),
|
||
);
|
||
}
|
||
|
||
// 判断是否开启权限方法
|
||
Future<void> _handleCameraAndMic(Permission permission) async {
|
||
PermissionStatus status = await permission.request();
|
||
print('权限状态$status');
|
||
if (!status.isGranted) {
|
||
openAppSettings();
|
||
}
|
||
}
|
||
|
||
@override
|
||
Widget _buttonstyle(theme, parameter) {
|
||
return Container(
|
||
child: Stack(
|
||
children: [
|
||
Container(
|
||
width: 80.0,
|
||
height: 40.0,
|
||
decoration: BoxDecoration(
|
||
borderRadius: BorderRadius.all(Radius.circular(2)),
|
||
border: Border.all(
|
||
width: 1,
|
||
color: parameter.isSelected
|
||
? theme
|
||
: Color.fromRGBO(222, 222, 222, 1)),
|
||
),
|
||
child: Center(
|
||
child: Text(
|
||
"${parameter.buttonText}",
|
||
style: TextStyle(
|
||
color: parameter.isSelected
|
||
? theme
|
||
: Color.fromRGBO(51, 51, 51, 1)),
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
);
|
||
}
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return Scaffold(
|
||
appBar: AppBar(
|
||
elevation: 0, // z轴阴影
|
||
titleSpacing: 0, // 标题与其他控件的间隔
|
||
backgroundColor: Colors.white,
|
||
leading: IconButton(
|
||
icon: Icon(Icons.arrow_back_ios, color: Colors.black),
|
||
onPressed: () => Navigator.of(context).pop(),
|
||
),
|
||
title: Text(
|
||
'创建派对房间',
|
||
style: TextStyle(
|
||
color: Color.fromRGBO(51, 51, 51, 1),
|
||
fontSize: 16,
|
||
fontWeight: FontWeight.bold),
|
||
),
|
||
),
|
||
backgroundColor: Colors.white,
|
||
resizeToAvoidBottomInset: false,
|
||
body: Container(
|
||
padding: EdgeInsets.all(15),
|
||
child: Form(
|
||
key: _formKey,
|
||
// autovalidateMode: AutovalidateMode.onUserInteraction, // 自动验证
|
||
child: Column(
|
||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
children: [
|
||
Column(
|
||
children: [
|
||
TextFormField(
|
||
controller: _roomName,
|
||
validator: (value) {
|
||
return value!.trim().isEmpty ? '请输入房间名' : null;
|
||
},
|
||
style: TextStyle(fontSize: 16.0),
|
||
textInputAction: TextInputAction.next,
|
||
decoration: InputDecoration(
|
||
hintText: '输入房间名',
|
||
hintStyle:
|
||
TextStyle(color: Color.fromRGBO(187, 187, 187, 1)),
|
||
contentPadding:
|
||
EdgeInsets.all(15.0), // 输入内容距离上下左右距离，该属性控制高度
|
||
fillColor: Color.fromRGBO(247, 248, 250, 1), // 输入框的背景填充颜色
|
||
filled: true,
|
||
suffixIcon: IconButton(
|
||
icon: Image.asset(
|
||
'images/createRoom/refresh.png',
|
||
width: 12.0,
|
||
height: 17.0,
|
||
),
|
||
onPressed: () {
|
||
_roomName.clear();
|
||
},
|
||
),
|
||
border: OutlineInputBorder(
|
||
borderRadius: BorderRadius.circular(10),
|
||
borderSide: BorderSide.none,
|
||
),
|
||
),
|
||
),
|
||
SizedBox(height: 25.0),
|
||
|
||
// 房间模式_单选框
|
||
Container(
|
||
padding: EdgeInsets.fromLTRB(0, 0, 0, 25),
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Text(
|
||
'房间模式',
|
||
textAlign: TextAlign.left,
|
||
style: TextStyle(
|
||
fontSize: 14.0,
|
||
color: Color.fromRGBO(153, 153, 153, 1),
|
||
),
|
||
),
|
||
SizedBox(height: 15),
|
||
Row(
|
||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
children: List<Widget>.generate(patternList.length,
|
||
(index) {
|
||
return InkWell(
|
||
child: _buttonstyle(
|
||
Color.fromRGBO(21, 185, 208, 1),
|
||
patternList[index]),
|
||
onTap: () {
|
||
setState(() {
|
||
patternList.forEach(
|
||
(element) => element.isSelected = false);
|
||
print(patternList[index].buttonText);
|
||
patternList[index].isSelected = true;
|
||
});
|
||
},
|
||
);
|
||
}),
|
||
),
|
||
],
|
||
),
|
||
),
|
||
|
||
// 房间标签_单选框
|
||
Container(
|
||
padding: EdgeInsets.fromLTRB(0, 0, 0, 25),
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Text(
|
||
'房间标签',
|
||
textAlign: TextAlign.left,
|
||
style: TextStyle(
|
||
fontSize: 14.0,
|
||
color: Color.fromRGBO(153, 153, 153, 1),
|
||
),
|
||
),
|
||
SizedBox(height: 15),
|
||
Row(
|
||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
children:
|
||
List<Widget>.generate(tagList.length, (index) {
|
||
return InkWell(
|
||
child: _buttonstyle(
|
||
Color.fromRGBO(239, 134, 146, 1),
|
||
tagList[index]),
|
||
onTap: () {
|
||
setState(() {
|
||
tagList.forEach(
|
||
(element) => element.isSelected = false);
|
||
print(tagList[index].buttonText);
|
||
tagList[index].isSelected = true;
|
||
});
|
||
},
|
||
);
|
||
}),
|
||
),
|
||
],
|
||
),
|
||
),
|
||
|
||
Divider(
|
||
height: 1.0,
|
||
color: Color.fromRGBO(235, 235, 235, 1),
|
||
),
|
||
SizedBox(height: 25.0),
|
||
Row(
|
||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
children: [
|
||
Text(
|
||
'房间密码',
|
||
style: TextStyle(color: Colors.black, fontSize: 16.0),
|
||
),
|
||
CupertinoSwitch(
|
||
value: flag,
|
||
activeColor: Color.fromRGBO(21, 185, 208, 1),
|
||
onChanged: (value) {
|
||
setState(() {
|
||
flag = value;
|
||
print(flag);
|
||
});
|
||
},
|
||
),
|
||
],
|
||
),
|
||
SizedBox(height: 40.0),
|
||
Row(
|
||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
children: [
|
||
Text(
|
||
'修改密码',
|
||
style: TextStyle(color: Colors.black, fontSize: 16.0),
|
||
),
|
||
GestureDetector(
|
||
onTap: () {
|
||
print('箭头图标被点击');
|
||
},
|
||
child: Icon(
|
||
size: 16.0,
|
||
Icons.arrow_forward_ios,
|
||
color: Color.fromRGBO(153, 153, 153, 1),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
],
|
||
),
|
||
Column(
|
||
children: [
|
||
Text(
|
||
'派对房间管理规范',
|
||
style: TextStyle(
|
||
color: Color.fromRGBO(153, 153, 153, 1),
|
||
fontSize: 12.0,
|
||
),
|
||
),
|
||
SizedBox(height: 5.0),
|
||
ElevatedButton(
|
||
child: const Text(
|
||
'创建',
|
||
style: TextStyle(fontSize: 16.0, color: Colors.white),
|
||
),
|
||
style: ElevatedButton.styleFrom(
|
||
primary: Color.fromRGBO(21, 185, 208, 1),
|
||
minimumSize: Size(188, 50),
|
||
shape: RoundedRectangleBorder(
|
||
borderRadius: BorderRadius.circular(30)),
|
||
),
|
||
onPressed: () {
|
||
if (_formKey.currentState!.validate()) {
|
||
print('表单验证通过！');
|
||
_create();
|
||
}
|
||
},
|
||
),
|
||
SizedBox(height: 52.0),
|
||
],
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
);
|
||
}
|
||
}
|
||
|
||
class RadioModel {
|
||
bool isSelected;
|
||
final String buttonText;
|
||
RadioModel(
|
||
this.isSelected,
|
||
this.buttonText,
|
||
);
|
||
}
|