A cross-platform mobile chat application built with Xamarin.Forms and ASP.NET Core SignalR, demonstrating real-time communication capabilities across multiple platforms.
- Real-time Chat: Instant messaging using SignalR Hub connections
- Cross-platform Support: Works on Android and iOS devices
- User Management: Join/leave chat functionality with user notifications
- Message Types: Support for user messages and system notifications
- Modern UI: Clean, responsive interface with Material Design-inspired styling
- Connection Management: Connect/disconnect functionality with status indicators
BuildChat/
├── BuildChat/ # Shared Xamarin.Forms project
│ ├── Models/ # Data models
│ ├── ViewModels/ # MVVM view models
│ ├── Converters/ # XAML value converters
│ └── Views/ # XAML pages
├── BuildChat.Android/ # Android-specific project
└── BuildChat.iOS/ # iOS-specific project
- Frontend: Xamarin.Forms 3.3.0
- Real-time Communication: ASP.NET Core SignalR Client 1.1.0
- Architecture Pattern: MVVM (Model-View-ViewModel)
- Platforms: Android, iOS
- Target Framework: .NET Standard 2.0
The app features a clean chat interface with:
- Connection status overlay
- Real-time message display
- User join/leave notifications
- Different message styling for own vs. other users
- System message indicators
- Visual Studio 2019 or later with Xamarin workload
- Xamarin.Forms 3.3.0 or later
- .NET Standard 2.0 support
- Android SDK (for Android development)
- Xcode (for iOS development, macOS only)
git clone <repository-url>
cd Xamarin-signalR-chat-sample- Open
BuildChat.slnin Visual Studio - Restore NuGet packages if prompted
The app connects to a SignalR hub at: http://signalrdemomsph.azurewebsites.net/chatHub
To use your own hub:
- Update the URL in
MainViewModel.csline 75:
hubConnection = new HubConnectionBuilder()
.WithUrl("YOUR_HUB_URL_HERE")
.Build();- Select your target platform (Android/iOS)
- Build the solution
- Deploy to device or emulator
The app implements the following SignalR hub methods:
- JoinChat: Notifies when a user joins the chat
- LeaveChat: Notifies when a user leaves the chat
- SendMessage: Sends a message to all connected users
- ReceiveMessage: Receives messages from other users
public class MessageModel
{
public string User { get; set; }
public string Message { get; set; }
public bool IsOwnMessage { get; set; }
public bool IsSystemMessage { get; set; }
}- Launch the app
- Enter your chat name in the connection overlay
- Tap "Connect" to join the chat
- Type your message in the input field
- Tap "Send" to broadcast to all connected users
- Tap the "Close" button in the header to disconnect from chat
- Manages SignalR connection lifecycle
- Handles message sending/receiving
- Implements INotifyPropertyChanged for UI binding
- Manages connection state
- Main chat interface
- Message list with custom styling
- Connection overlay for initial setup
- Input controls for messaging
InverseBoolConverter: Inverts boolean values for XAML binding
The app demonstrates key SignalR concepts:
- Hub Connection: Establishes connection to SignalR hub
- Real-time Communication: Instant message delivery
- User Management: Track user presence
- Error Handling: Connection state management
- Build the
BuildChat.Androidproject - Generate APK or AAB for distribution
- Deploy to Google Play Store or direct installation
- Build the
BuildChat.iOSproject - Archive and distribute via App Store or TestFlight
- Fork the repository
- Create a feature branch
- Make your changes
- Test on both platforms
- Submit a pull request
This project is provided as a sample for educational purposes. Please refer to the original Microsoft Build 2019 materials for licensing information.
For issues and questions:
- Check the existing issues in this repository
- Review SignalR and Xamarin.Forms documentation
- Contact the development team
Note: This is a sample application created for Microsoft Build 2019. The SignalR hub endpoint may not be permanently available. For production use, deploy your own SignalR hub and update the connection URL accordingly.