Click | Engin Polat\'ın Windows 8 , Windows Phone 8 ve C# içerikli programcılık sitesi

Arşiv

Etiketlenen yazılar click

Windows 10 UWP uygulamalarında TTS için Speech Synthesis kullanımı

10 March 2016 Yorum yapılmamış

Uygulamalarımıza TTS (text-to-speech, yani yazıdan-sese) özelliği ekleyerek belirlediğimiz metinlerin sese dönüştürülmesini sağlayabiliriz.

Windows 8.1 ve Windows Phone 8.1 zamanından beri kullanımımıza açık olan SpeechSynthesis namespace‘i aracılığıyla uygulamamıza TTS desteği ekleyebiliriz.

Hemen yeni bir proje oluşturarak kodlamaya başlayalım;

MainPage.xaml dosyasını açarak sese dönüştürmek istediğimiz metni yazabileceğimiz bir TextBox, bir de Button nesnesi ekleyelim.

Bir metnin sese dönüştürülerek okunması için uygulamamıza ses dosyalarını oynatabilecek bir nesne eklememiz yeterlidir. Bunu için MainPage.xaml dosyasına bir tane de MediaElement nesnesi ekleyelim.

<Page
	x:Class="SpeechSynthesisOrnek.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:local="using:SpeechSynthesisOrnek">

	<StackPanel Margin="20">
		<TextBox x:Name="Cumle" Header="Söylenecek Cümle" />
		<Button Content="Söyle" Click="Button_Click" />

		<MediaElement x:Name="mediaElement" />
	</StackPanel>

</Page>

Böylece uygulamanın başlangıç ekranı aşağıdaki gibi gözükmeli;

MainPage.xaml.cs dosyasında Button_Click() methodu aracılığıyla, butona tıklandığında yapılacak işleri yazıyoruz;

private async void Button_Click(object sender, RoutedEventArgs e)
{
	var synth = new SpeechSynthesizer();
	var synthStream = await synth.SynthesizeTextToStreamAsync(Cumle.Text);
	mediaElement.SetSource(synthStream, synthStream.ContentType);
}

Bu methodun içerisinde öncelikle SpeechSynthesizer sınıfından yeni bir değişken oluşturduk.

SynthesizeTextToStreamAsync() methoduna okunmasını istediğimiz metni string tipinde parametre olarak verdik ve geri dönen SpeechSynthesisStream tipindeki cevabı bir değişkene atadık.

Son olarak, ekranda yeralan MediaElement nesnesinin SetSource() methoduna SpeechSynthesisStream tipindeki değişkenimizi parametre olarak vererek, oluşan sesin oynatılmasını sağladık.

Böylece, ekrandaki TextBox nesnesine yazılan cümle, Button nesnesine tıklandığında uygulama tarafından okunacak ve bizler de duyabileceğiz.

Windows 10 UWP uygulamasında MediaEditing ile resimlerden video oluşturmak

06 March 2016 Yorum yapılmamış

Bu makale’de ilginç bir uygulama yazarak, 10 adet resim ve 1 adet mp3 dosyasından 1 adet video üreteceğiz.

Aşağıdaki projeyi geliştirirken ihtiyacımız olacak örnek dosyaları aşağıda paylaşıyorum;

Hemen yeni bir Blank App (Universal Windows) proje oluşturalım;

MainPage.xaml dosyasını açalım içerisindeki kodları aşağıdaki şekilde güncelleyelim. Böylece ekranda bir Button nesnesi gözükecek, üzerine tıklandığında resim ve ses dosyaları kullanılarak bir video oluşturulacak, oluşturulan video dosyası Button‘un hemen altına eklediğimiz MediaElement nesnesinde oynatılacak.

<Page
	x:Class="CreatingVideoFromImages.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:local="using:CreatingVideoFromImages">

	<StackPanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
		<Button Content="Video Oluştur" Click="Button_Click" />

		<MediaElement x:Name="player" Width="1024" Height="768" />
	</StackPanel>

</Page>

MainPage.xaml.cs dosyasında Button_Click() methodunu oluşturmalıyız;

private async void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
	var composition = new MediaComposition();
	var folderPhotos = await Package.Current.InstalledLocation.GetFolderAsync("Assets\\Photos");

	foreach (var file in await folderPhotos.GetFilesAsync())
	{
		var clip = await MediaClip.CreateFromImageFileAsync(file, TimeSpan.FromMilliseconds(3500));

		composition.Clips.Add(clip);
	}

	var folderSounds = await Package.Current.InstalledLocation.GetFolderAsync("Assets\\Sounds");

	foreach (var file in await folderSounds.GetFilesAsync())
	{
		var track = await BackgroundAudioTrack.CreateFromFileAsync(file);

		composition.BackgroundAudioTracks.Add(track);
	}

	var renderFile = await ApplicationData.Current.LocalFolder.CreateFileAsync("video.mp4", CreationCollisionOption.GenerateUniqueName);

	await composition.RenderToFileAsync(renderFile);

	player.SetSource(await renderFile.OpenReadAsync(), renderFile.ContentType);

	player.Play();
}

Yukarıdaki kod bloğunda öncelikle MediaComposition sınıfından yeni bir değişken oluşturuyoruz. Böylece istediğimiz kadar resim, ses veya video dosyasını bu composition değişkenine ekleyerek yeni bir video oluşturabileceğiz.

Package sınıfının InstalledLocation property‘sinden erişebildiğimiz GetFolderAsync() methodu ile projenin istediğim dizinine erişebiliyor, GetFilesAsync() methodunu kullanarak içindeki dosyaları elde edebiliyoruz.

MediaClip sınıfının static CreateFromImageFileAsync() methodunu kullanarak TimeSpan sınıfı aracılığıyla belirlediğimiz süre kadar videoda görüntülenecek resimleri composition değişkenine ekliyoruz.

BackgroundAudioTrack sınıfının static CreateFromFileAsync() methodunu kullanarak videonun arkaplan sesi olacak ses dosyalarını composition değişkenine ekliyoruz.

ApplicationData sınıfının LocalFolder property‘si aracılığı ile erişebildiğimiz CreateFileAsync() methodu aracılığıyla video.mp4 isimli dosyayı oluşturuyoruz, ikinci parametrede CreationCollisionOption.GenerateUniqueName değerini verdiğimiz için aynı isimli bir dosya zaten dizinde varsa dosyaya yeni bir isim verilecek.

MediaComposition sınıfının RenderToFileAsync() methodunu kullanarak, resim ve ses dosyaları eklediğim composition değişkeninden video oluşturuyoruz.

Ekranda yeralan MediaElement nesnesinin SetSource() methodunu kullanarak oluşturduğumuz video dosyasını yüklüyor, Play() methodunu kullanarak ekranda oynatmaya başlıyoruz.

Bu makalede verdiğim resim ve ses dosyalarını kullanarak oluşturulan videoyu aşağıda izleyebilirsiniz;

Windows 10 UWP uygulamasında Log için Slack kullanmak

22 February 2016 Yorum yapılmamış

Bu makaleyi okumadan önce Windows 10 UWP uygulamasında {x:Bind} kullanarak basit DataBinding makalesini okumanızı tavsiye ederim.

Slack, http://www.slack.com adresinde hizmet veren, son yılların en başarılı uygulamalarından birisi. Kendi sitelerinde yazana göre;

Slack is a messaging app for teams that is on a mission to make your working life simpler, more pleasant, and more productive

Geçen hafta aldığım çok ilginç bir email‘de bir uygulamada loglama için Slack kullanabilir miyiz? sorusu vardı.

Bu makalede Windows 10 UWP uygulamasında Slack entegrasyonu yapacağız, fakat aynı yöntemler ile rahatlıkla bir web uygulamasında veya web service‘inde aynı entegrasyon kurulabilir.

Öncelikle Slack üzerinde ücretsiz olarak bir hesap, hesabı oluşturduktan sonra yeni bir Channel oluşturmamız gerekiyor. Örneğin SlackLoggerApp-Logs isimli bir channel oluşturmak için;

Yeni bir public channel oluşturunca Slack sayfasında aşağıdaki gibi bir mesaj gözükmeli;

Got it! butonuna tıkladığımızda bizi channel‘in sayfasına yönlendirmeli;

https://{hesap}.slack.com/apps/build/custom-integration adresine giderek yazacağımız uygulamanın entegre olacağı Slack web servisini oluşturuyoruz. Bunun için Incoming WebHooks seçeneğini seçerek ilerlememiz lazım;

Gelen ekranda uygulamamızı geliştirirken ihtiyaç duyacağımız tüm bilgiler yer alıyor. Özellikle Webhook URL ve Sending Messages alanındaki bilgilere kesinlikle ihtiyacımız olacak;

Bu noktaya geldikten sonra Visual Studio‘yu açalım ve yeni bir Blank App (Universal App) projesi oluşturalım;

Projeyi oluşturduktan sonra MainPage.xaml dosyasını açalım ve aşağıdaki kodları yazalım;

<Page
	x:Class="SlackLogger.MainPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:local="using:SlackLogger">

	<StackPanel Background="#1abc9c" Padding="10">
		<TextBox Header="Adınız" Margin="5" BorderBrush="Transparent" Text="{x:Bind FirstName, Mode=TwoWay}" />
		<TextBox Header="Soyadınız" Margin="5" BorderBrush="Transparent" Text="{x:Bind LastName, Mode=TwoWay}" />
		<TextBox Header="EMail Adresiniz" Margin="5" BorderBrush="Transparent" Text="{x:Bind EMail, Mode=TwoWay}" />
		<TextBox Header="Mesajınız" Margin="5" Height="300" BorderBrush="Transparent" Text="{x:Bind MessageBody, Mode=TwoWay}" />
		<Button Content="Gönder" Margin="5" Height="40" HorizontalAlignment="Stretch" Click="{x:Bind Send}" />
	</StackPanel>

</Page>

Önce bir StackPanel nesnesi oluşturduk, içerisine 4 adet Textbox 1 adet Button nesnesi ekledik.

Textbox nesnelerinin Header özelliklerine verdiğimiz değerler ile birer başlığa sahip olmalarını sağladık.

BorderBrush özelliklerine verdiğimiz Transparent değer sayesinde çerçevelerin gözükmemesini sağladık.

Son olarak, Text özelliklerine ve Click olayına {x:Bind} tipinde değerler vererek Databinding yapıyoruz. Burada önemli olan nokta, Textbox‘ların Text özelliklerine yaptığımız Databinding‘de Mode özelliğine TwoWay değerini vererek, iki yönlü Databinding yapmak. Böylece ekranda bir değer değiştirildiği zaman Databinding yapıldığı property‘nin değeri otomatik olarak güncellenecek.

Böylece çalıştırdığımızda aşağıdaki gibi gözüken bir uygulama elde edeceğiz;

Databinding için FirstName, LastName, EMail ve MessageBody property‘lerini, ayrıca Send() methodunu yazmamız lazım. MainPage.xaml.cs dosyasını açalım ve aşağıdaki kodları ekleyelim;

public string FirstName { get; set; }
public string LastName { get; set; }
public string EMail { get; set; }
public string MessageBody { get; set; }

private async void Send()
{
	var client = new HttpClient();

	var payload = "{\"text\": \"" + FirstName + " " + LastName + "(" + EMail + ") : " + MessageBody + "\"}";

	await client.PostAsync(new Uri("https://hooks.slack.com/services/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"), new HttpStringContent(payload));
}

Böylece Gönder butonuna basıldığında Slack‘te oluşturduğumuz public channel‘ın web service‘ine istediğimiz bilgiyi gönderebileceğiz. Bu makaledeki örnekte Ad Soyad (EMail) : Message formatında bilgiyi Windows.Web.Http namespace‘i altında yeralan HttpClient sınıfının PostAsync() methoduna HttpStringContent tipinde gönderiyoruz.

Gönder butonuna bastığımızda, Slack, aşağıdaki notification‘ı gösterecek;

Eğer Slack‘teki public channel‘ın sayfasını açacak olursak, orada da mesajı görebileceğiz;

Windows Phone 8 varsayılan harita uygulaması ile yol tarifi alma

21 August 2013 Yorum yapılmamış

Windows Phone 8 SDK ile birlikte gelen MapsDirectionsTask sınıfı sayesinde yol güzergahı hesaplatmak ve kullanıcıya göstermek çok kolaylaştı.

Start ve End özelliklerine uygun değerleri girerek iki nokta arasında yol tarifi alabilmek mümkün.

Bu özelliği denemek için ekrana bir buton ekleyelim;

<Button x:Name="btnMap" Content="Güzergah Hesapla" Height="140" Width="420" Click="btnMap_Click" />

Eklediğimiz Button‘un Click event‘ine bağladığımız method‘u yazalım;

var task = new MapsDirectionsTask();

task.End = new LabeledMapLocation("Kadıköy Rıhtım", new GeoCoordinate(40.990, 29.025));

task.Show();

MapsDirectionsTask sınıfından yeni bir instance çıkartıp, End özelliğine LabeledMapLocation sınıfından bir değişken atıyoruz.

GeoCoordinate sınıfının constructor‘ında varış noktasının koordinatlarını vermemiz gerekiyor, ben örnek olarak 40.990 ve 29.025 değerlerini verdim böylece Kadıköy Rıhtım‘a nasıl gidileceğini buluyor olacağız;

Start özelliğine değer atamadığımız için konum servisinden bulunan konumumuz kullanılacak ve End özelliğine verdiğimiz konum’a giden güzergah hesaplanarak ekranda bir harita ve altında liste şeklide gösterilecek;

Windows Phone 8 uygulamasına Network Connection ayarları sayfası eklemek

14 February 2013 Yorum yapılmamış

Windows Phone 8 uygulamanıza Network Connection ayarları sayfalarını (örneğin; Airplane, Bluetooth, Cellular, WiFi) açan butonlar/linkler mi eklemek istiyorsunuz?

Bu yazıda ilgili ayarlar ekranlarını nasıl açacağımıza bakacağız.

Kullanmaya başlamadan önce Microsoft.Phone.Tasks namespace‘inde yeralan ConnectionSettingsTask sınıfını inceleyelim;

namespace Microsoft.Phone.Tasks
{
	public sealed class ConnectionSettingsTask
	{
		public ConnectionSettingsTask();
		public ConnectionSettingsType ConnectionSettingsType { get; set; }
		public void Show();
	}

	public enum ConnectionSettingsType
	{
		WiFi = 0,
		Bluetooth = 1,
		Cellular = 2,
		AirplaneMode = 3,
	}
}

Gördüğünüz gibi sealed anahtar kelimesi ile kalıtıma kapatılmış sınıf‘ın constructor haricinde ConnectionSettingsType tipinde ConnectionSettingsType isminde bir property’si, Show isminde bir method‘u bulunmakta.

ConnectionSettingsType enum’ı 4 adet değer içermektedir; WiFi, Bluetooth, Cellular ve AirplaneMode

Uygulama içerisinden ilgili ayarlar ekranını açmak için, örneğin bir buton‘un veya bir hyperlink‘in Click event‘ine aşağıdaki kodları yazmak lazım;

WiFi ayarlar ekranı açmak için;

ConnectionSettingsTask task = new ConnectionSettingsTask();
task.ConnectionSettingsType = ConnectionSettingsType.WiFi;
task.Show();

Bluetooth ayarlar ekranını açmak için;

ConnectionSettingsTask task = new ConnectionSettingsTask();
task.ConnectionSettingsType = ConnectionSettingsType.Bluetooth;
task.Show();

Cellular ayarlar ekranını açmak için;

ConnectionSettingsTask task = new ConnectionSettingsTask();
task.ConnectionSettingsType = ConnectionSettingsType.Cellular;
task.Show();

AirplaneMode ayarlar ekranını açmak için;

ConnectionSettingsTask task = new ConnectionSettingsTask();
task.ConnectionSettingsType = ConnectionSettingsType.AirplaneMode;
task.Show();