From 1804e43fa2d5fe5c5d34a0dc4f434c8f79d52ec7 Mon Sep 17 00:00:00 2001
From: Salvatore Giordano <salvatoregiordanoo@gmail.com>
Date: Mon, 2 Mar 2020 11:35:07 +0100
Subject: [PATCH] update readme

---
 README.md | 105 +++++++++++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 100 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index e99cb632..e8666f7c 100644
--- a/README.md
+++ b/README.md
@@ -18,11 +18,13 @@
 
 ## Flutter Chat Tutorial
 
-The best place to start is the [Flutter Chat Tutorial](https://getstream.io/chat/flutter/tutorial/). It teaches you how to use this SDK and also shows how to make common changes.
+The best place to start is the [Flutter Chat Tutorial](https://getstream.io/chat/flutter/tutorial/).
+It teaches you how to use this SDK and also shows how to make common changes.
 
 ## Example App
 
-TODO
+This repo includes a fully functional example app with setup instructions.
+The example is available under the [example](https://github.com/GetStream/stream-chat-flutter/tree/master/example) folder.
 
 ### Add dependency
 
@@ -35,12 +37,105 @@ You should then run `flutter packages get`
 
 ## Docs
 
-TODO
+### Business logic components
+
+We provide 2 Widgets dedicated to business logic and state management:
+
+- StreamChat
+- StreamChannel
+
+### UI Components
+
+These are the available Widgets that you can use to build your application UI.
+Every widget uses the StreamChat or StreamChannel widgets to manage the state and communicate with Stream services.
+
+- ChannelHeader
+- ChannelImage
+- ChannelListView
+- ChannelName
+- ChannelPreview
+- MessageInput
+- MessageListView
+- MessageWidget
+- StreamChatTheme
+- ThreadHeader
+
 
 ### Customizing styles
 
-TODO
+The Flutter SDK comes with a fully designed set of widgets which you can customize to fit with your application style and typography.
+Changing the theme of Chat widgets works in a very similar way that MaterialApp and Theme do.
+
+Out of the box all chat widgets use their own default styling, there are two ways to change the styling:
+
+  1. Initialize the StreamChatTheme from your existing MaterialApp style
+  ```dart
+  class MyApp extends StatelessWidget {
+    final Client client;
+
+    MyApp(this.client);
+
+    @override
+    Widget build(BuildContext context) {
+      final theme = ThemeData(
+        primarySwatch: Colors.green,
+      );
+
+      return MaterialApp(
+        theme: theme,
+        home: Container(
+          child: StreamChat(
+           streamChatThemeData: StreamChatThemeData.fromTheme(theme),
+            client: client,
+            child: ChannelListPage(),
+          ),
+        ),
+      );
+    }
+  }
+  ```
+
+  2. Construct a custom theme and provide all the customizations needed
+  ```dart
+  class MyApp extends StatelessWidget {
+    final Client client;
+
+    MyApp(this.client);
+
+    @override
+    Widget build(BuildContext context) {
+      final theme = ThemeData(
+        primarySwatch: Colors.green,
+      );
+
+      return MaterialApp(
+        theme: theme,
+        home: Container(
+          child: StreamChat(
+            streamChatThemeData: StreamChatThemeData.fromTheme(theme).copyWith(
+              ownMessageTheme: MessageTheme(
+                messageBackgroundColor: Colors.black,
+                messageText: TextStyle(
+                  color: Colors.white,
+                ),
+                avatarTheme: AvatarTheme(
+                  borderRadius: BorderRadius.circular(8),
+                ),
+              ),
+            ),
+            client: client,
+            child: ChannelListPage(),
+          ),
+        ),
+      );
+    }
+  }
+  ```
 
 ## Contributing
 
-We welcome code changes that improve this library or fix a problem, please make sure to follow all best practices and add tests if applicable before submitting a Pull Request on Github. We are very happy to merge your code in the official repository. Make sure to sign our [Contributor License Agreement (CLA)](https://docs.google.com/forms/d/e/1FAIpQLScFKsKkAJI7mhCr7K9rEIOpqIDThrWxuvxnwUq2XkHyG154vQ/viewform) first. See our license file for more details.
+We welcome code changes that improve this library or fix a problem,
+please make sure to follow all best practices and add tests if applicable before submitting a Pull Request on Github.
+We are very happy to merge your code in the official repository.
+Make sure to sign our [Contributor License Agreement (CLA)](https://docs.google.com/forms/d/e/1FAIpQLScFKsKkAJI7mhCr7K9rEIOpqIDThrWxuvxnwUq2XkHyG154vQ/viewform) first.
+See our license file for more details.