Flutter插件allride_package的特性与安装方法介绍

Flutter插件allride_package的特性与安装方法介绍

Flutter插件allride_package的特性

此插件专为AllRide应用设计，提供了自定义组件的使用。

Flutter插件allride_package的安装

方法1

在pubspec.yaml文件中添加最新版本的插件并运行dart pub get：

dependencies:
   all_ride: ^0.0.1

方法2

导入插件并在Flutter应用中使用：

import 'package:all_ride/all_ride.dart';

使用示例

以下代码展示了如何使用allride_package中的自定义组件。

全按钮 (fullButton)

// 创建一个全按钮
Widget fullButtonExample = AllRide.fullButton(
  context: context,
  onPressed: () {
    print("Full Button Pressed");
  },
  label: "点击我",
  color: Colors.blue,
  labelColor: Colors.white,
  height: 60.0,
);

文本按钮 (textButton)

// 创建一个文本按钮
Widget textButtonExample = AllRide.textButton(
  context: context,
  onPressed: () {
    print("Text Button Pressed");
  },
  label: "点击这里",
  labelColor: Colors.red,
  height: 40.0,
);

卡片组件 (card)

// 创建一个带有阴影的圆角卡片
Widget cardExample = AllRide.card(
  context: context,
  onPressed: () {
    print("Card Pressed");
  },
  child: Container(
    padding: EdgeInsets.all(16.0),
    child: Text("这是卡片内容"),
  ),
  color: Colors.grey[200],
  shadowColor: Colors.black12,
  isRounded: true,
);

示例演示

以下是完整的示例代码，展示了如何在Flutter应用中集成这些组件。

import 'package:flutter/material.dart';
import 'package:all_ride/all_ride.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('AllRide Package 示例'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              // 全按钮示例
              AllRide.fullButton(
                context: context,
                onPressed: () {
                  print("Full Button Pressed");
                },
                label: "全按钮",
                color: Colors.blue,
                labelColor: Colors.white,
                height: 60.0,
              ),
              SizedBox(height: 20),
              // 文本按钮示例
              AllRide.textButton(
                context: context,
                onPressed: () {
                  print("Text Button Pressed");
                },
                label: "文本按钮",
                labelColor: Colors.red,
                height: 40.0,
              ),
              SizedBox(height: 20),
              // 卡片示例
              AllRide.card(
                context: context,
                onPressed: () {
                  print("Card Pressed");
                },
                child: Container(
                  padding: EdgeInsets.all(16.0),
                  child: Text("这是卡片内容"),
                ),
                color: Colors.grey[200],
                shadowColor: Colors.black12,
                isRounded: true,
              ),
            ],
          ),
        ),
      ),
    );
  }
}