Bu yazımızda online çalışabilen basit bir sohbet uygulaması geliştirilecektir. Uygulamanın online çalışabilmesi için veriler uzaktan erişime açık bir mysql sunucu üzerinde tutulacaktır.
1.Adım: Projenin Oluşturulması
2.Adım:Uygulama Arayüzünün Tasarlanması
MainPage.xaml dosyası uygulamızın arayüzünü oluşturacak kodları içerecektir.
Aşağıda ki seçili olan kodları seçip siliyoruz.
2.Adım: Uygulama Arayüzünün Oluşturulması
Uygulama arayüzü, oturum açmış olan kullanıcıların bir listesinin bulunduğu MainPage.xaml ve sohbet için kullanılan ChatPage.xaml sayfalarından oluşmaktadır.
MainPage.xaml
Bu sayfa kullanıcı listesi ile birlikte aynı zamanda uygulama ilk çalıştığında bizi karşılayan ana sayfayı oluşturmaktadır.
MainPage.xaml Sayfasını Oluşturan Kodlar
<?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="XFSohbet.MainPage"> <StackLayout> <Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0"> <Label Text="Sohbet V1.0" HorizontalTextAlignment="Center" TextColor="White" FontSize="36"/> </Frame> <ListView x:Name="listeLV" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" ItemsSource="{Binding .}" HasUnevenRows="True" SeparatorVisibility="None" BackgroundColor="White"> <ListView.ItemTemplate> <DataTemplate > <ViewCell> <ViewCell.View> <ContentView> <StackLayout VerticalOptions="CenterAndExpand"> <Frame CornerRadius="5" BackgroundColor="LightSteelBlue" Margin="5" Padding="10"> <Label x:Name="adLbl" Text="{Binding ad}" FontSize="30"> <Label.GestureRecognizers> <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"></TapGestureRecognizer> </Label.GestureRecognizers> </Label> </Frame> </StackLayout> </ContentView> </ViewCell.View> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> <Grid Padding="5"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions > <RowDefinition Height="Auto" /> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <Label x:Name="durumLbl" Text="Oturum Açılmadı" Grid.Row="0" Grid.Column="0" HorizontalOptions="CenterAndExpand" VerticalOptions="Center" FontSize="15" ></Label> <Entry x:Name="kullaniciTxt" Keyboard="Text" Placeholder="Kullanıcı Adı" Grid.Row="0" Grid.Column="1" ></Entry> <Button x:Name="oturumKapatBtn" IsEnabled="False" CornerRadius="10" Grid.Row="1" Grid.Column="0" Text="Oturumu Kapat" FontSize="15" HorizontalOptions="CenterAndExpand" Clicked="oturumKapatBtn_Clicked"></Button> <Button x:Name="oturumAcBtn" CornerRadius="10" Grid.Row="1" Grid.Column="1" Text="Oturumu Aç" FontSize="15" HorizontalOptions="CenterAndExpand" Clicked="oturumAcBtn_Clicked"></Button> </Grid> </StackLayout> </ContentPage>
ChatPage.xaml
Bu sayfa, karşılıklı mesajlaşmanın yapıldığı sayfayı oluşturmaktadır.
ChatPage.xaml Sayfasını Oluşturan Kodlar
<?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="XFSohbet.ChatPage"> <ContentPage.Content> <StackLayout> <Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0"> <Label x:Name="kisiLbl" HorizontalTextAlignment="Center" TextColor="White" FontSize="36"/> </Frame> <ListView x:Name="listeLV" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" ItemsSource="{Binding .}" HasUnevenRows="True" SeparatorVisibility="None"> <ListView.ItemTemplate> <DataTemplate > <ViewCell> <ViewCell.View> <ContentView> <StackLayout VerticalOptions="CenterAndExpand"> <Frame HorizontalOptions="{Binding kimden}" CornerRadius="10" BackgroundColor="{Binding renk}" Margin="5"> <Label Text="{Binding mesaj}"></Label> </Frame> </StackLayout> </ContentView> </ViewCell.View> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> <Grid Padding="5"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions > <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <Entry x:Name="mesajTxt" Keyboard="Text" Placeholder="Mesaj" Grid.Row="0" Grid.Column="0" HorizontalOptions="FillAndExpand" ></Entry> <Button x:Name="gonderBtn" CornerRadius="10" Grid.Row="0" Grid.Column="1" Text="Gönder" FontSize="15" HorizontalOptions="EndAndExpand" Clicked="gonderBtn_Clicked"></Button> </Grid> </StackLayout> </ContentPage.Content> </ContentPage>
3.Adım: Uygulamayı Oluşturan C# Kodları
MainPage.xaml.cs Dosyası Kodları
using System; using System.Collections.Generic; using System.ComponentModel; using System.Linq; using System.Text; using System.Threading.Tasks; using Xamarin.Forms; using MySqlConnector; using System.Threading; using System.Data; namespace XFSohbet { public partial class MainPage : ContentPage { MySqlConnection baglanti; String ad; int oturum = 0; public MainPage() { InitializeComponent(); } public void baglan()//mysql sunucu bağlantısı { try { MySqlConnectionStringBuilder msb = new MySqlConnectionStringBuilder(); msb.Server = "sunucu adresi"; msb.Database = "veritabanı adı"; msb.UserID = "veritabanı kullanıcısı"; msb.Password = "veritabanı parola"; baglanti = new MySqlConnection(); baglanti.ConnectionString = msb.ConnectionString; baglanti.Open(); durumLbl.Text = "Oturum Açılmadı"; } catch { durumLbl.Text = "Hata oluştu"; } } public async void listele()//kullanıcıListele metodunu periyodik olarak sürekli çağıran asenkron metot { while (oturum==1) { Device.BeginInvokeOnMainThread(() => { kullaniciListele(ad); }); await Task.Delay(1000); } } public void kullaniciListele(String ad)//veritabanındaki kullanıcıları listeleyen metot { if (baglanti==null) { baglan(); } String cumle = "select * from sohbetdb where aktif=1"; MySqlDataAdapter mda = new MySqlDataAdapter(cumle, baglanti); DataTable dt = new DataTable(); mda.Fill(dt); List<Kisi> liste = new List<Kisi>(); foreach(var satir in dt.Rows) { Kisi k = new Kisi(); DataRow dr = (DataRow)satir; if ((int)dr[2] == 1&&dr[1].ToString()!=ad) { k.id = (int)dr[0]; k.ad = (String)dr[1]; liste.Add(k); } } listeLV.BindingContext = liste; } public int kullaniciVarmi(String ad)//Oturum Aç butonuna basıldığında girilen kullanıcı { //adını veritabanından sorgular. Eğer varsa aktif hale getirir try { String cumle = "select * from sohbetdb where ad='"+ad+"'"; MySqlDataAdapter mda = new MySqlDataAdapter(cumle, baglanti); DataTable dt = new DataTable(); mda.Fill(dt); if(dt.Rows.Count>0) { cumle = "update sohbetdb set aktif=1 where ad='" + ad + "'"; MySqlCommand mcom = new MySqlCommand(); mcom.Connection = baglanti; mcom.CommandText = cumle; mcom.ExecuteNonQuery(); return 1; } else { return 0; } } catch { durumLbl.Text = "Hata oluştu"; } return 0; } public void oturumAc(String ad)//Oturum Aç butonuna basıldığında girilen kullanıcı adını { //kullaniciVarmi metodu ile sorgular, eğer yoksa kullanıcıyı ekler try { if (String.IsNullOrWhiteSpace(ad)==false) { if (baglanti == null) { baglan(); } int sonuc = kullaniciVarmi(ad); if (sonuc == 0) { String cumle = "insert into sohbetdb(ad,aktif) values('" + ad + "',1)"; MySqlCommand mcom = new MySqlCommand(); mcom.CommandText = cumle; mcom.Connection = baglanti; mcom.ExecuteNonQuery(); } durumLbl.Text = ad; kullaniciTxt.IsEnabled = false; oturumAcBtn.IsEnabled = false; oturumKapatBtn.IsEnabled = true; this.ad = ad; oturum = 1; listele(); } else { durumLbl.Text = "Kullanıcı Adı Gir"; } } catch { durumLbl.Text = "Hata oluştu"; } } public void oturumKapat(String ad)//Oturumu kapatır. { try { String cumle = "update sohbetdb set aktif='0' where ad='"+ad+"'"; MySqlCommand mcom = new MySqlCommand(); mcom.CommandText = cumle; mcom.Connection = baglanti; mcom.ExecuteNonQuery(); durumLbl.Text = "Oturum Açılmadı"; kullaniciTxt.IsEnabled = true; baglanti.Close(); baglanti = null; oturumAcBtn.IsEnabled = true; oturumKapatBtn.IsEnabled = false; listeLV.BindingContext = null; oturum = 0; } catch { durumLbl.Text = "Hata oluştu"; } } private void oturumAcBtn_Clicked(object sender, EventArgs e) { oturumAc(kullaniciTxt.Text); } private void oturumKapatBtn_Clicked(object sender, EventArgs e) { oturumKapat(kullaniciTxt.Text); } private async void TapGestureRecognizer_Tapped(object sender, EventArgs e) { var lbl = sender as Label; await Navigation.PushModalAsync(new ChatPage(kullaniciTxt.Text,lbl.Text));//kullanıcı listesinden bir kullanıcı seçildiğinde ChatPage sayfasına geçilir. } } }
ChatPage.xaml.cs Dosyası Kodları
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using Xamarin.Forms; using Xamarin.Forms.Xaml; using MySqlConnector; using System.Data; using System.Threading; namespace XFSohbet { [XamlCompilation(XamlCompilationOptions.Compile)] public partial class ChatPage : ContentPage { MySqlConnection baglanti; String kime,ad; public ChatPage(String ad,String kime)//Sayfaya girişte var olan mesajları listeler { InitializeComponent(); this.kime = kime; this.ad = ad; kisiLbl.Text = kime + " ile Sohbet"; listele(); } public async void listele()//mesajları periyodik olarak veritabanından kontrol eder ve listeler { while (true) { Device.BeginInvokeOnMainThread(() => { mesajListele(ad, kime); }); await Task.Delay(1000); } } public void baglan()//mysql bağlantısı { try { MySqlConnectionStringBuilder msb = new MySqlConnectionStringBuilder(); msb.Server = "sunucu adresi"; msb.Database = "veritabanı adı"; msb.UserID = "veritabanı kullanıcısı"; msb.Password = "veritabanı parola"; baglanti = new MySqlConnection(); baglanti.ConnectionString = msb.ConnectionString; baglanti.Open(); } catch { kisiLbl.Text = "Hata oluştu"; } } public void mesajListele(String ad,String kime)//mesajları veritabanından sorgulayıp listeler { try { if (baglanti == null) { baglan(); } kisiLbl.Text = kime + " ile Sohbet"; String cumle = "select * from mesajdb where ad='"+ad+"' or kime='"+ad+"'"; MySqlDataAdapter mda = new MySqlDataAdapter(cumle, baglanti); DataTable dt = new DataTable(); mda.Fill(dt); List<Mesaj> liste = new List<Mesaj>(); foreach (var satir in dt.Rows) { Mesaj m = new Mesaj(); DataRow dr = (DataRow)satir; if(dr[1].ToString()==ad&& dr[3].ToString()==kime) { m.kimden = LayoutOptions.EndAndExpand; m.renk = Color.LightGreen; m.mesaj = dr[2].ToString(); liste.Add(m); } if (dr[3].ToString() == ad&&dr[1].ToString()==kime) { m.kimden = LayoutOptions.StartAndExpand; m.renk = Color.WhiteSmoke; m.mesaj = dr[2].ToString(); liste.Add(m); } } listeLV.BindingContext = liste; listeLV.ScrollTo(liste[liste.Count - 1], ScrollToPosition.End, true); } catch { kisiLbl.Text = "Mesaj yok"; } } private void gonderBtn_Clicked(object sender, EventArgs e)//mesajları veritabanına kaydeden buton { try { if (String.IsNullOrWhiteSpace(mesajTxt.Text) == false) { String cumle = "insert into mesajdb(ad,mesaj,kime) values('" + ad + "','"+mesajTxt.Text+"','"+kime+"')"; MySqlCommand mcom = new MySqlCommand(); mcom.CommandText = cumle; mcom.Connection = baglanti; mcom.ExecuteNonQuery(); mesajTxt.Text = ""; mesajListele(ad, kime); } } catch { kisiLbl.Text = "Hata oluştu"; } } } }
4.Adım: Uygulamaya Ait Veritabanı
Aşağıdaki tablolar mysql sunucusunda oluşturulmalı ve bu tablolara erişim yetkisi olan bir veritabanı kullanıcısı oluşturulmalıdır.
mesajdb Tablosu
id | ad | mesaj | kime |
1 | Ahmet | Merhaba | Mehmet |
sohbetdb Tablosu
id | ad | aktif |
1 | Ahmet | 1 |
2 | Mehmet | 1 |
Uygulama Kodları
Mysql tarafındaki şablonu da siteye ekler misiniz hocam? Teşekkürler, iyi çalışmalar.
Eklendi.