kitcod_uikit_flutter 0.1.0+8 copy "kitcod_uikit_flutter: ^0.1.0+8" to clipboard
kitcod_uikit_flutter: ^0.1.0+8 copied to clipboard

A UIKit from Kitcod.

example/lib/main.dart

import 'dart:convert';

import 'package:flutter/material.dart';
import "package:http/http.dart" as http;

import 'package:kitcod_uikit_flutter/kitcod_uikit_flutter.dart';
import 'package:shared_preferences/shared_preferences.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Kidcod UIKit Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Kidcod UIKit Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> implements ConnectedHandler {
  UserProfile? profileDetails;
  bool initialLoading = true;

  @override
  void initState() {
    /*if (prefs.getString("userId") != null) {
      initialLoading = false;
      StoreKitcodUserDetails.instance
          .storeData("TQjlSPCLC294W0bSt34ec4gJogOCEk1x1WayTjJx", prefs.getString("userId")!);
    } else {
      createKitcodUser();
    }*/
    getSharedPrefs();
    super.initState();
  }

  Future<Null> getSharedPrefs() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    String? _userId = prefs.getString("userId");
    setState(() {
      if (_userId != null) {
        KitCodUIKit.init.connect("TQjlSPCLC294W0bSt34ec4gJogOCEk1x1WayTjJx",
            "Ali", "Sunasara", "", _userId, this);
      } else {
        // createKitcodUser();
        KitCodUIKit.init.connect("TQjlSPCLC294W0bSt34ec4gJogOCEk1x1WayTjJx",
            "Ronaldo", "Christiano", "", "", this);
      }
    });
  }

/*
  Future<void> createKitcodUser() async {
    profileDetails = await KitcodApi.instance.createUser(
        "Fateh", "Sarkar", "", "TQjlSPCLC294W0bSt34ec4gJogOCEk1x1WayTjJx");
    SharedPreferences prefs = await SharedPreferences.getInstance();
    setState(() {
      if (profileDetails!.id!.isNotEmpty) {
        prefs.setString("userId", profileDetails!.id!);
        KitCodUIKit.init.storeData("TQjlSPCLC294W0bSt34ec4gJogOCEk1x1WayTjJx",
            profileDetails!.id!, this);
        initialLoading = false;
      }
    });
  }
*/

  TextButton _profileOverview() => TextButton(
        onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => UserProfileView(
                headerView: HeaderView(
                  backgroundColor: Colors.indigoAccent.withOpacity(0.1),
                  leftSideIcon: IconButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    icon: const Icon(
                      Icons.arrow_back_outlined,
                      color: Colors.black,
                    ),
                  ),
                  header: const Text(
                    "Profile Overview",
                    style: TextStyle(color: Colors.black),
                  ),
                  headerAlignment: Alignment.centerLeft,
                ),
                nameStyle: const TextStyle(
                  fontSize: 20.0,
                  fontWeight: FontWeight.bold,
                ),
                button: Button(
                  name: "Follow",
                  onPressed: () {},
                  backgroundColor: Colors.indigoAccent,
                  textStyle: const TextStyle(color: Colors.white),
                  height: 40,
                ),
                profileDetailsNameStyle: TextStyle(color: Colors.grey.shade600),
                profileDetailsValueStyle:
                    const TextStyle(fontWeight: FontWeight.bold),
                //groupsList: feedGroupsArray,
                groupCardButtonColor: Colors.indigoAccent,
                groupCardButtonStyle: const TextStyle(color: Colors.white),
                groupCardMembersStyle:
                    const TextStyle(color: Colors.grey, fontSize: 12),
                groupCardTitleStyle: const TextStyle(
                    fontSize: 17,
                    fontWeight: FontWeight.bold,
                    color: Colors.black),
                groupPageAboutStyle:
                    const TextStyle(fontSize: 15, color: Colors.grey),
                groupPageMembersStyle: const TextStyle(
                    fontSize: 17,
                    fontWeight: FontWeight.bold,
                    color: Colors.black),
                groupPageStatusStyle:
                    const TextStyle(fontSize: 17, color: Colors.grey),
                groupPageTitleStyle: const TextStyle(
                  fontSize: 30,
                  fontWeight: FontWeight.bold,
                  color: Colors.black,
                ),
                avatarSize: 12,
                postPostedTimeStyle: const TextStyle(
                  fontSize: 15,
                  color: Colors.grey,
                ),
                postFeedTitleStyle: const TextStyle(
                    fontSize: 15,
                    color: Colors.black,
                    fontWeight: FontWeight.bold),
                postFeedDescriptionStyle:
                    const TextStyle(fontSize: 15, color: Colors.black),
                postFeedAudioTitleStyle: const TextStyle(
                    fontSize: 17,
                    fontWeight: FontWeight.bold,
                    color: Colors.black),
                postNameStyle: const TextStyle(
                    fontSize: 15,
                    fontWeight: FontWeight.bold,
                    color: Colors.black),
                postUserNameStyle: const TextStyle(
                    fontSize: 15,
                    color: Colors.black,
                    fontWeight: FontWeight.normal),
                postGroupTagsStyle: const TextStyle(color: Colors.indigo),
                //feedPostsArray: feedPostsArray,
              ),
            ),
          );
        },
        child: const Center(child: Text("UserProfileView Screen")),
      );

  TextButton _createPost() => TextButton(
        onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => CreateEditPost(
                  isEdit: false,
                  headerView: HeaderView(
                    backgroundColor: Colors.white.withOpacity(0.1),
                    leftSideIcon: IconButton(
                      onPressed: () {
                        Navigator.pop(context);
                      },
                      icon: const Icon(
                        Icons.arrow_back_outlined,
                        color: Colors.black,
                      ),
                    ),
                    header: const Text(
                      "Create New",
                      style: TextStyle(color: Colors.black),
                    ),
                    headerAlignment: Alignment.centerLeft,
                  ),
                  nameStyle: const TextStyle(
                      fontSize: 15,
                      fontWeight: FontWeight.bold,
                      color: Colors.black),
                  // userNameStyle: const TextStyle(
                  //     fontSize: 15,
                  //     color: Colors.yellow,
                  //     fontWeight: FontWeight.normal),
                  groupTagsStyle: const TextStyle(color: Colors.indigo),
                  //groupsList: feedGroupsArraySimple,
                  descriptionStyle: const TextStyle(color: Colors.grey),
                  headingStyle:
                      const TextStyle(color: Colors.black, fontSize: 15),
                  //iconColor: Colors.yellow,
                  iconBackgroundColor: Colors.indigo.shade50,
                  postType: const [
                    PostType.announcement,
                    PostType.poll,
                  ],
                  moreOptions: const [
                    MoreOptions.image,
                    MoreOptions.video,
                    MoreOptions.audio,
                    MoreOptions.button
                  ]),
            ),
          );
        },
        child: const Center(child: Text("CreatePost Screen")),
      );

  TextButton _createGroup() => TextButton(
      onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => CreateGroup(
              headerView: HeaderView(
                backgroundColor: Colors.white.withOpacity(0.1),
                leftSideIcon: IconButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  icon: const Icon(
                    Icons.arrow_back_outlined,
                    color: Colors.black,
                  ),
                ),
                header: const Text(
                  "Create New Group",
                  style: TextStyle(color: Colors.black),
                ),
                headerAlignment: Alignment.centerLeft,
              ),
            ),
          ),
        );
      },
      child: const Center(child: Text("CreateGroup Screen")));

  TextButton _createGroupCommunity() => TextButton(
      onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => CreateGroupCommunity(
              headerView: HeaderView(
                backgroundColor: Colors.white.withOpacity(0.1),
                leftSideIcon: IconButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  icon: const Icon(
                    Icons.arrow_back_outlined,
                    color: Colors.black,
                  ),
                ),
                header: const Text(
                  "Create New Group",
                  style: TextStyle(color: Colors.black),
                ),
                headerAlignment: Alignment.centerLeft,
              ),
              heading: "Community Access",
              description: "Choose who can join the community",
              descriptionStyle: const TextStyle(
                  fontWeight: FontWeight.w600,
                  fontSize: 14,
                  color: Colors.grey),
              headingStyle:
                  const TextStyle(fontWeight: FontWeight.w600, fontSize: 16),
              optionDescriptionStyle:
                  const TextStyle(color: Colors.grey, fontSize: 10),
              optionTitleStyle: const TextStyle(color: Colors.black),
              disabledColor: Colors.grey.shade200,
              selectedColor: Colors.red,
              optionIconColor: Colors.green,
              addIconColor: Colors.grey,
              addIconTextStyle: const TextStyle(color: Colors.grey),
              bottomButtonColor: Colors.indigoAccent,
              bottomButtonBorderColor: Colors.indigoAccent,
              bottomButtonStyle:
                  const TextStyle(color: Colors.white, fontSize: 16),
            ),
          ),
        );
      },
      child: const Center(child: Text("CreateGroup Community Screen")));

  TextButton _createGroupSetting() => TextButton(
      onPressed: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => CreateGroupSetting(
              headerView: HeaderView(
                backgroundColor: Colors.white.withOpacity(0.1),
                leftSideIcon: IconButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  icon: const Icon(
                    Icons.arrow_back_outlined,
                    color: Colors.black,
                  ),
                ),
                header: const Text(
                  "Finish Setting Up Your Group",
                  style: TextStyle(color: Colors.black),
                ),
                headerAlignment: Alignment.centerLeft,
              ),
              upperDescription:
                  "Your group is almost ready! Just a few things we thought you may wan to do",
              lowerDescription:
                  "In a rush? You can always do these things later",
              descriptionStyle: const TextStyle(
                  fontWeight: FontWeight.w600,
                  fontSize: 16,
                  color: Colors.grey),
            ),
          ),
        );
      },
      child: const Center(child: Text("CreateGroup Setting Screen")));

  TextButton _newsFeed() => TextButton(
        onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => NewsFeed(
                  headerView: HeaderView(
                    backgroundColor: Colors.white.withOpacity(0.1),
                    backButton: false,
                    header: const Text(
                      "News Feed",
                      style: TextStyle(color: Colors.black),
                    ),
                    headerAlignment: Alignment.centerLeft,
                  ),
                  postType: const [PostType.announcement, PostType.poll],
                  nameStyle: const TextStyle(
                      fontSize: 15,
                      fontWeight: FontWeight.bold,
                      color: Colors.black),
                  userNameStyle: const TextStyle(
                      fontSize: 15,
                      color: Colors.black,
                      fontWeight: FontWeight.normal),
                  groupTagsStyle: const TextStyle(color: Colors.indigo),
                  //groupsList: feedGroupsArraySimple,
                  descriptionStyle: const TextStyle(color: Colors.grey),
                  headingStyle:
                      const TextStyle(color: Colors.black, fontSize: 17),
                  //iconColor: Colors.yellow,
                  iconBackgroundColor: Colors.indigo.shade50,
                  moreOptions: const [
                    MoreOptions.image,
                    MoreOptions.video,
                    MoreOptions.audio
                  ],
                  postedTimeStyle: const TextStyle(
                    fontSize: 15,
                    color: Colors.grey,
                  ),
                  feedTitleStyle: const TextStyle(
                      fontSize: 15,
                      color: Colors.black,
                      fontWeight: FontWeight.bold),
                  feedDescriptionStyle:
                      const TextStyle(fontSize: 15, color: Colors.black),
                  feedAudioTitleStyle: const TextStyle(
                      fontSize: 17,
                      fontWeight: FontWeight.bold,
                      color: Colors.black),
                  hintText: "Create a Post...",
                  commentNameStyle: const TextStyle(
                      fontSize: 15,
                      fontWeight: FontWeight.bold,
                      color: Colors.black),
                  commentPostedTimeStyle:
                      const TextStyle(color: Colors.grey, fontSize: 12),
                  commentStyle:
                      const TextStyle(fontSize: 15, color: Colors.black),
                  commentSubmitButtonColor: Colors.blue),
            ),
          );
        },
        child: const Center(child: Text("News Feed Screen")),
      );

  TextButton _myGroups() => TextButton(
        onPressed: () {
          Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => MyGroups(
                  headerView: HeaderView(
                    backgroundColor: Colors.white.withOpacity(0.1),
                    header: const Text(
                      "My groups",
                      style: TextStyle(color: Colors.black),
                    ),
                    headerAlignment: Alignment.centerLeft,
                    leftSideIcon: IconButton(
                      onPressed: () {
                        Navigator.pop(context);
                      },
                      icon: const Icon(
                        Icons.arrow_back_outlined,
                        color: Colors.black,
                      ),
                    ),
                  ),
                  //groupsList: feedGroupsArraySimple,
                  titleStyle: const TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.bold,
                      fontSize: 15),
                  membersStyle: const TextStyle(color: Colors.grey),
                ),
              ));
        },
        child: const Center(child: Text("My groups")),
      );

  // TextButton _groups() => TextButton(
  //       onPressed: () {
  //         Navigator.push(
  //             context,
  //             MaterialPageRoute(
  //               builder: (context) =>
  //               //const ImagePickerWidget(),
  //               // Groups(
  //               //   headerView: HeaderView(
  //               //     backgroundColor: Colors.white.withOpacity(0.1),
  //               //     header: const Text(
  //               //       "Groups",
  //               //       style: TextStyle(color: Colors.black),
  //               //     ),
  //               //     headerAlignment: Alignment.centerLeft,
  //               //     leftSideIcon: IconButton(
  //               //       onPressed: () {
  //               //         Navigator.pop(context);
  //               //       },
  //               //       icon: const Icon(
  //               //         Icons.arrow_back_outlined,
  //               //         color: Colors.black,
  //               //       ),
  //               //     ),
  //               //   ),
  //               //   //groupsList: feedGroupsArray,
  //               //   groupCardButtonColor: Colors.indigoAccent,
  //               //   groupCardButtonStyle: const TextStyle(color: Colors.white),
  //               //   groupCardMembersStyle: const TextStyle(color: Colors.grey),
  //               //   groupCardTitleStyle: const TextStyle(
  //               //       fontSize: 17,
  //               //       fontWeight: FontWeight.bold,
  //               //       color: Colors.black),
  //               //   groupPageAboutStyle:
  //               //       const TextStyle(fontSize: 15, color: Colors.grey),
  //               //   groupPageMembersStyle: const TextStyle(
  //               //       fontSize: 17,
  //               //       fontWeight: FontWeight.bold,
  //               //       color: Colors.black),
  //               //   groupPageStatusStyle:
  //               //       const TextStyle(fontSize: 17, color: Colors.grey),
  //               //   groupPageTitleStyle: const TextStyle(
  //               //     fontSize: 30,
  //               //     fontWeight: FontWeight.bold,
  //               //     color: Colors.black,
  //               //   ),
  //               // ),
  //             );
  //       },
  //       child: const Center(child: Text("Groups")),
  //     );

  // TextButton _discoverGroups() => TextButton(
  //       onPressed: () {
  //         Navigator.push(
  //           context,
  //           MaterialPageRoute(
  //             builder: (context) => DiscoverGroups(
  //               headerView: HeaderView(
  //                 backgroundColor: Colors.white.withOpacity(0.1),
  //                 header: const Text(
  //                   "Discover Groups",
  //                   style: TextStyle(color: Colors.black),
  //                 ),
  //                 headerAlignment: Alignment.centerLeft,
  //                 leftSideIcon: IconButton(
  //                   onPressed: () {
  //                     Navigator.pop(context);
  //                   },
  //                   icon: const Icon(
  //                     Icons.arrow_back_outlined,
  //                     color: Colors.black,
  //                   ),
  //                 ),
  //                 rightSideIcon: TextButton(
  //                   onPressed: () => Navigator.push(
  //                     context,
  //                     MaterialPageRoute(
  //                       builder: (context) => CreateGroupCommunity(
  //                         headerView: HeaderView(
  //                           backgroundColor: Colors.white.withOpacity(0.1),
  //                           leftSideIcon: IconButton(
  //                             onPressed: () {
  //                               Navigator.pop(context);
  //                             },
  //                             icon: const Icon(
  //                               Icons.arrow_back_outlined,
  //                               color: Colors.black,
  //                             ),
  //                           ),
  //                           header: const Text(
  //                             "Create New Group",
  //                             style: TextStyle(color: Colors.black),
  //                           ),
  //                           headerAlignment: Alignment.centerLeft,
  //                         ),
  //                         heading: "Community Access",
  //                         description: "Choose who can join the community",
  //                         descriptionStyle: const TextStyle(
  //                             fontWeight: FontWeight.w600,
  //                             fontSize: 14,
  //                             color: Colors.grey),
  //                         headingStyle: const TextStyle(
  //                             fontWeight: FontWeight.w600, fontSize: 16),
  //                         optionDescriptionStyle:
  //                             const TextStyle(color: Colors.grey, fontSize: 10),
  //                         optionTitleStyle:
  //                             const TextStyle(color: Colors.black),
  //                         disabledColor: Colors.grey.shade200,
  //                         selectedColor: Colors.red,
  //                         optionIconColor: Colors.green,
  //                         addIconColor: Colors.grey,
  //                         addIconTextStyle: const TextStyle(color: Colors.grey),
  //                         bottomButtonColor: Colors.indigoAccent,
  //                         bottomButtonBorderColor: Colors.indigoAccent,
  //                         bottomButtonStyle: const TextStyle(
  //                             color: Colors.white, fontSize: 16),
  //                       ),
  //                     ),
  //                   ),
  //                   child: Container(
  //                     decoration: BoxDecoration(
  //                         border: Border.all(
  //                           color: Colors.grey,
  //                         ),
  //                         borderRadius:
  //                             const BorderRadius.all(Radius.circular(20))),
  //                     margin: const EdgeInsets.symmetric(horizontal: 10),
  //                     height: 30,
  //                     width: 75,
  //                     alignment: Alignment.center,
  //                     child: Row(
  //                       children: const [
  //                         Icon(
  //                           Icons.add,
  //                           color: Colors.black,
  //                         ),
  //                         Text("Create",
  //                             textAlign: TextAlign.center,
  //                             style: TextStyle(color: Colors.black)),
  //                       ],
  //                     ),
  //                   ),
  //                 ),
  //               ),
  //               groupsList: feedGroupsArray,
  //               groupCardButtonColor: Colors.indigoAccent,
  //               groupCardButtonStyle: const TextStyle(color: Colors.white),
  //               groupCardMembersStyle: const TextStyle(color: Colors.grey),
  //               groupCardTitleStyle: const TextStyle(
  //                   fontSize: 20,
  //                   fontWeight: FontWeight.bold,
  //                   color: Colors.black),
  //               groupPageAboutStyle:
  //                   const TextStyle(fontSize: 15, color: Colors.grey),
  //               groupPageMembersStyle: const TextStyle(
  //                   fontSize: 17,
  //                   fontWeight: FontWeight.bold,
  //                   color: Colors.black),
  //               groupPageStatusStyle:
  //                   const TextStyle(fontSize: 17, color: Colors.grey),
  //               groupPageTitleStyle: const TextStyle(
  //                 fontSize: 30,
  //                 fontWeight: FontWeight.bold,
  //                 color: Colors.black,
  //               ),
  //               avatarSize: 10,
  //               groupCardHeight: 300,
  //             ),
  //           ),
  //         );
  //       },
  //       child: const Center(child: Text("Discover Groups")),
  //     );

  @override
  Widget build(BuildContext context) => initialLoading
      ? const Center(
          child: Padding(
          padding: EdgeInsets.all(8),
          child: CircularProgressIndicator(),
        ))
      : Scaffold(
          body: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              //_profileOverview(),
              //_createPost(),
              _newsFeed(),
              //_groups(),
              //_createGroup(),
              //_createGroupCommunity(),
              //_createGroupSetting(),
              //_myGroups(),
              //_discoverGroups(),
              //_groups()
            ],
          ),
        );

  @override
  void onConnected(String var1, Exception? exception) {
    if (exception != null) {
      return;
    }
    storeData(var1);
    setState(() {
      initialLoading = false;
    });
  }
}

Future<Null> storeData(String var1) async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  prefs.setString("userId", var1);
}