Profil Ekranında Aksiyonların Hazırlanması

Veri Aksiyonları Oluşturma

About this lesson

Bu öğrenme içeriğinde bir fikrim var web ve mobil uygulamasında yer alan ekranlardan biri olan kullanıcı profil ekranı için aksiyonları birlikte hazırlayacağız.

Web uygulamayla devam edelim.

Kullanıcı profilini incelediğimizde ekranda kullanıcı bilgilerinin yer aldığı bir kart yapısını görüntülüyoruz. Bu kart yapısı içerisinde, giriş yapmış kullanıcının görseli, adı ve soyadı, departmanı ve Title’ı yer almaktadır. Bu bilgileri kart yapısında göstermek için bir select aksiyon oluşturacağız.

Ekranın devamında kullanıcıların oluşturduğu fikir sayısını gösteren bir metin alanı yer aldığını görüntülüyoruz. Bu alan için bir özel aksiyon ihtiyacı ortaya çıkmaktadır.

Ekranda son olarak kullanıcının oluşturduğu fikirlerin listelendiğini görüntülüyoruz. Bu listeleme işlevini sağlayacak Select Action’u da birlikte oluşturacağız.

Birlikte bu aksiyonları oluşturmaya başlayalım.

Ekranda yer alan, profil bilgilerinin görüntülenmesini sağlayan, aksiyon için giriş yapmış kullanıcın kullanıcı adına yani e-posta adresine göre listeleme işlevi sağlayan özel aksiyonu oluşturalım. 

  1. Sol tarafta yer alan Custom Actions panelini açın ve Managed DB ifadesi yanında yer alan + ikonuna tıklayın.
  2. Açılan Menüden Select Action’u seçin.
  3. Aksiyonunuzu isimlendirin.
  4. Choose Source alanı aracılığıyla Personnel tablosunu seçin.
  5. Personnel tablosunun yanında yer alan link işaretine tıklayın ve Department tablosuyla ilişki oluşturun.
  6. Fields alanını kullanarak varsayılan olarak gelen alanların yanı sıra, Personnel tablosunda bulunan Id kolonunu ekleyip, Alias alanında PersonnelId isimlendirmesini yapın. 
  7. Ardından personnel tablosundan Fullname, PersonnelImage ve Title alanlarını ekleyin.
  8. Devamında Department tablosundan Id kolonunu ekleyip DepartmentID olarak isimlendirin. Field alanında son olarak DepartmentName kolonunu seçin.
  9. Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  10. Ardından en sağda yer alan symbol picker’a tıklayıp Default kategorisinde bulunan Current Username seçimini yapın.
  11. Create butonuna tıklayarak aksiyonu oluşturun.

Şimdi profilde yer alacak, kullanıcı tarafından oluşturulan fikirlerin sayısını verecek aksiyonu oluşturalım.

  1. Custom Actions panelini kullanarak yeni bir Select Action oluşturun.
  2. Aksiyonu isimlendirin.
  3. Idea tablosunu seçin ve Personnel tablosuyla ilişkilendirin.
  4. Fields alanında Field alanında Id seçimini yapın ve Count fonksiyonu seçin.
  5. Alias alanında UserIdeaCount isimlendirmesini yapın.
  6. Varsayılan oluşturulan Field’leri silin.
  7. Devamında Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  8. Create butonuna tıklayın.

Devamında GalleryView içerisinde yer alan yapıyı kurgulamak için Select Action öğrenme içeriğine benzer yapıda aksiyonumuzu oluşturalım.

  1. Yeni bir Select Action oluşturun ve isimlendirin.
  2. Choose Source alanı aracılığıyla Idea tablosunu seçin.
  3. Idea tablosu yanında yer alan link ikonuna tıklayın. 
  4. Açılan ekrandan Idea tablosuyla ilişkili olan Personnel tablosunu seçin.
  5. Aynı işlemi bu seferde IdeaCategory tablosu için yapalım.
  6. Fields sekmesini açın. 

Fields sekmesinde varsayılan olarak gelen seçimlere ekleme yaparak ilerleyelim.

  1. Idea tablosunda sırasıyla ilk olarak Id’yi ekleyin. Alias alanında IdeaID isimlendirmesini yapın.
  2. Devamında sırasıyla, CreatedDate, IdeaHolder, IdeaImage, Ideatitle seçimlerini yapın.

Şimdi Personnel tablosundaki kolonları ekleyerek ilerleyelim.

  1. İlk olarak Personnel Tablosunda yer alan ID’yi seçin ve Alias alanı aracılığıyla PersonnelID isimlendirmesini verin.
  2. Ardından Fullname, PersonnelImage ve Title seçimlerini yapın.Son olarak Category tablosunda yer alan ID’yi ekleyin ve Alias aracılığıyla CategoryID olarak isimlendirin. 
  3. Devamında Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  4. Ardından en sağda yer alan symbol picker’a tıklayıp Default kategorisinde bulunan Current Username seçimini yapın.

Profil ekranında kullanıcı tarafından oluşturulmuş fikirlerin son eklenenden ilk eklene doğru listelenmesi için bir sıralama yapısı kurgulayalım.

  1. Şimdi SortOrder sekmesini açın, Idea tablosunu seçin, kolon olarak CreatedDate kolonu seçin ve Descending seçimini yapın.
  2. Create butonuna tıklayarak aksiyonu oluşturma işlemini tamamlayın.

Böylece girişi yapmış kullanıcının profil ekranı için gerekli aksiyonları oluşturmuş olduk. Benzer akışı takip ederek Bir fikrim var mobil uygulamasında profil aksiyonlarını oluşturmanızı bekliyoruz.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Bu öğrenme içeriğinde bir fikrim var web ve mobil uygulamasında yer alan ekranlardan biri olan kullanıcı profil ekranı için aksiyonları birlikte hazırlayacağız.

Web uygulamayla devam edelim.

Kullanıcı profilini incelediğimizde ekranda kullanıcı bilgilerinin yer aldığı bir kart yapısını görüntülüyoruz. Bu kart yapısı içerisinde, giriş yapmış kullanıcının görseli, adı ve soyadı, departmanı ve Title’ı yer almaktadır. Bu bilgileri kart yapısında göstermek için bir select aksiyon oluşturacağız.

Ekranın devamında kullanıcıların oluşturduğu fikir sayısını gösteren bir metin alanı yer aldığını görüntülüyoruz. Bu alan için bir özel aksiyon ihtiyacı ortaya çıkmaktadır.

Ekranda son olarak kullanıcının oluşturduğu fikirlerin listelendiğini görüntülüyoruz. Bu listeleme işlevini sağlayacak Select Action’u da birlikte oluşturacağız.

Birlikte bu aksiyonları oluşturmaya başlayalım.

Ekranda yer alan, profil bilgilerinin görüntülenmesini sağlayan, aksiyon için giriş yapmış kullanıcın kullanıcı adına yani e-posta adresine göre listeleme işlevi sağlayan özel aksiyonu oluşturalım. 

  1. Sol tarafta yer alan Custom Actions panelini açın ve Managed DB ifadesi yanında yer alan + ikonuna tıklayın.
  2. Açılan Menüden Select Action’u seçin.
  3. Aksiyonunuzu isimlendirin.
  4. Choose Source alanı aracılığıyla Personnel tablosunu seçin.
  5. Personnel tablosunun yanında yer alan link işaretine tıklayın ve Department tablosuyla ilişki oluşturun.
  6. Fields alanını kullanarak varsayılan olarak gelen alanların yanı sıra, Personnel tablosunda bulunan Id kolonunu ekleyip, Alias alanında PersonnelId isimlendirmesini yapın. 
  7. Ardından personnel tablosundan Fullname, PersonnelImage ve Title alanlarını ekleyin.
  8. Devamında Department tablosundan Id kolonunu ekleyip DepartmentID olarak isimlendirin. Field alanında son olarak DepartmentName kolonunu seçin.
  9. Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  10. Ardından en sağda yer alan symbol picker’a tıklayıp Default kategorisinde bulunan Current Username seçimini yapın.
  11. Create butonuna tıklayarak aksiyonu oluşturun.

Şimdi profilde yer alacak, kullanıcı tarafından oluşturulan fikirlerin sayısını verecek aksiyonu oluşturalım.

  1. Custom Actions panelini kullanarak yeni bir Select Action oluşturun.
  2. Aksiyonu isimlendirin.
  3. Idea tablosunu seçin ve Personnel tablosuyla ilişkilendirin.
  4. Fields alanında Field alanında Id seçimini yapın ve Count fonksiyonu seçin.
  5. Alias alanında UserIdeaCount isimlendirmesini yapın.
  6. Varsayılan oluşturulan Field’leri silin.
  7. Devamında Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  8. Create butonuna tıklayın.

Devamında GalleryView içerisinde yer alan yapıyı kurgulamak için Select Action öğrenme içeriğine benzer yapıda aksiyonumuzu oluşturalım.

  1. Yeni bir Select Action oluşturun ve isimlendirin.
  2. Choose Source alanı aracılığıyla Idea tablosunu seçin.
  3. Idea tablosu yanında yer alan link ikonuna tıklayın. 
  4. Açılan ekrandan Idea tablosuyla ilişkili olan Personnel tablosunu seçin.
  5. Aynı işlemi bu seferde IdeaCategory tablosu için yapalım.
  6. Fields sekmesini açın. 

Fields sekmesinde varsayılan olarak gelen seçimlere ekleme yaparak ilerleyelim.

  1. Idea tablosunda sırasıyla ilk olarak Id’yi ekleyin. Alias alanında IdeaID isimlendirmesini yapın.
  2. Devamında sırasıyla, CreatedDate, IdeaHolder, IdeaImage, Ideatitle seçimlerini yapın.

Şimdi Personnel tablosundaki kolonları ekleyerek ilerleyelim.

  1. İlk olarak Personnel Tablosunda yer alan ID’yi seçin ve Alias alanı aracılığıyla PersonnelID isimlendirmesini verin.
  2. Ardından Fullname, PersonnelImage ve Title seçimlerini yapın.Son olarak Category tablosunda yer alan ID’yi ekleyin ve Alias aracılığıyla CategoryID olarak isimlendirin. 
  3. Devamında Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  4. Ardından en sağda yer alan symbol picker’a tıklayıp Default kategorisinde bulunan Current Username seçimini yapın.

Profil ekranında kullanıcı tarafından oluşturulmuş fikirlerin son eklenenden ilk eklene doğru listelenmesi için bir sıralama yapısı kurgulayalım.

  1. Şimdi SortOrder sekmesini açın, Idea tablosunu seçin, kolon olarak CreatedDate kolonu seçin ve Descending seçimini yapın.
  2. Create butonuna tıklayarak aksiyonu oluşturma işlemini tamamlayın.

Böylece girişi yapmış kullanıcının profil ekranı için gerekli aksiyonları oluşturmuş olduk. Benzer akışı takip ederek Bir fikrim var mobil uygulamasında profil aksiyonlarını oluşturmanızı bekliyoruz.

Kuika Platformunda yeni bir kullanıcı arayüzüne geçiyoruz ve Kuika Akademi kurslarımızı ve videolarımızı mümkün olan en kısa sürede güncelliyoruz.

Bu öğrenme içeriğinde bir fikrim var web ve mobil uygulamasında yer alan ekranlardan biri olan kullanıcı profil ekranı için aksiyonları birlikte hazırlayacağız. Web uygulamasında, kullanıcı profil kartında gösterilecek bilgileri içeren Select aksiyonunu oluşturmak için giriş yapmış kullanıcının e-posta adresine göre listeleme işlevini sağlayacağız.

Bu öğrenme içeriğinde bir fikrim var web ve mobil uygulamasında yer alan ekranlardan biri olan kullanıcı profil ekranı için aksiyonları birlikte hazırlayacağız.

Web uygulamayla devam edelim.

Kullanıcı profilini incelediğimizde ekranda kullanıcı bilgilerinin yer aldığı bir kart yapısını görüntülüyoruz. Bu kart yapısı içerisinde, giriş yapmış kullanıcının görseli, adı ve soyadı, departmanı ve Title’ı yer almaktadır. Bu bilgileri kart yapısında göstermek için bir select aksiyon oluşturacağız.

Ekranın devamında kullanıcıların oluşturduğu fikir sayısını gösteren bir metin alanı yer aldığını görüntülüyoruz. Bu alan için bir özel aksiyon ihtiyacı ortaya çıkmaktadır.

Ekranda son olarak kullanıcının oluşturduğu fikirlerin listelendiğini görüntülüyoruz. Bu listeleme işlevini sağlayacak Select Action’u da birlikte oluşturacağız.

Birlikte bu aksiyonları oluşturmaya başlayalım.

Ekranda yer alan, profil bilgilerinin görüntülenmesini sağlayan, aksiyon için giriş yapmış kullanıcın kullanıcı adına yani e-posta adresine göre listeleme işlevi sağlayan özel aksiyonu oluşturalım. 

  1. Sol tarafta yer alan Custom Actions panelini açın ve Managed DB ifadesi yanında yer alan + ikonuna tıklayın.
  2. Açılan Menüden Select Action’u seçin.
  3. Aksiyonunuzu isimlendirin.
  4. Choose Source alanı aracılığıyla Personnel tablosunu seçin.
  5. Personnel tablosunun yanında yer alan link işaretine tıklayın ve Department tablosuyla ilişki oluşturun.
  6. Fields alanını kullanarak varsayılan olarak gelen alanların yanı sıra, Personnel tablosunda bulunan Id kolonunu ekleyip, Alias alanında PersonnelId isimlendirmesini yapın. 
  7. Ardından personnel tablosundan Fullname, PersonnelImage ve Title alanlarını ekleyin.
  8. Devamında Department tablosundan Id kolonunu ekleyip DepartmentID olarak isimlendirin. Field alanında son olarak DepartmentName kolonunu seçin.
  9. Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  10. Ardından en sağda yer alan symbol picker’a tıklayıp Default kategorisinde bulunan Current Username seçimini yapın.
  11. Create butonuna tıklayarak aksiyonu oluşturun.

Şimdi profilde yer alacak, kullanıcı tarafından oluşturulan fikirlerin sayısını verecek aksiyonu oluşturalım.

  1. Custom Actions panelini kullanarak yeni bir Select Action oluşturun.
  2. Aksiyonu isimlendirin.
  3. Idea tablosunu seçin ve Personnel tablosuyla ilişkilendirin.
  4. Fields alanında Field alanında Id seçimini yapın ve Count fonksiyonu seçin.
  5. Alias alanında UserIdeaCount isimlendirmesini yapın.
  6. Varsayılan oluşturulan Field’leri silin.
  7. Devamında Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  8. Create butonuna tıklayın.

Devamında GalleryView içerisinde yer alan yapıyı kurgulamak için Select Action öğrenme içeriğine benzer yapıda aksiyonumuzu oluşturalım.

  1. Yeni bir Select Action oluşturun ve isimlendirin.
  2. Choose Source alanı aracılığıyla Idea tablosunu seçin.
  3. Idea tablosu yanında yer alan link ikonuna tıklayın. 
  4. Açılan ekrandan Idea tablosuyla ilişkili olan Personnel tablosunu seçin.
  5. Aynı işlemi bu seferde IdeaCategory tablosu için yapalım.
  6. Fields sekmesini açın. 

Fields sekmesinde varsayılan olarak gelen seçimlere ekleme yaparak ilerleyelim.

  1. Idea tablosunda sırasıyla ilk olarak Id’yi ekleyin. Alias alanında IdeaID isimlendirmesini yapın.
  2. Devamında sırasıyla, CreatedDate, IdeaHolder, IdeaImage, Ideatitle seçimlerini yapın.

Şimdi Personnel tablosundaki kolonları ekleyerek ilerleyelim.

  1. İlk olarak Personnel Tablosunda yer alan ID’yi seçin ve Alias alanı aracılığıyla PersonnelID isimlendirmesini verin.
  2. Ardından Fullname, PersonnelImage ve Title seçimlerini yapın.Son olarak Category tablosunda yer alan ID’yi ekleyin ve Alias aracılığıyla CategoryID olarak isimlendirin. 
  3. Devamında Filter alanında Personnel tablosunu seçin, ardından email kolonunu seçin ve varsayılan gelen is equal to seçimini seçili olarak bırakın.
  4. Ardından en sağda yer alan symbol picker’a tıklayıp Default kategorisinde bulunan Current Username seçimini yapın.

Profil ekranında kullanıcı tarafından oluşturulmuş fikirlerin son eklenenden ilk eklene doğru listelenmesi için bir sıralama yapısı kurgulayalım.

  1. Şimdi SortOrder sekmesini açın, Idea tablosunu seçin, kolon olarak CreatedDate kolonu seçin ve Descending seçimini yapın.
  2. Create butonuna tıklayarak aksiyonu oluşturma işlemini tamamlayın.

Böylece girişi yapmış kullanıcının profil ekranı için gerekli aksiyonları oluşturmuş olduk. Benzer akışı takip ederek Bir fikrim var mobil uygulamasında profil aksiyonlarını oluşturmanızı bekliyoruz.

Dosyalar

No items found.

Kaynaklar

No items found.

Sözlük

No items found.

Ödev

E-Posta Tasarımı
Email Builder Temelleri
Şablonların Kullanımı
Yeni Email Tasarımı
Mobil Arayüz Geliştirme
Mobil Ekran Tasarımlarına Giriş
Tabbar Tasarımı
Dashboard Ekran Tasarımım
Form Ekranının Tasarlanması
Listeleme Ekran Tasarımım
Detay Ekran Tasarımı
Mobile UI Prototipleme
Web UI Prototipleme
Aksiyonlarla Çalışmak
Navigasyonlarla Çalışma
Ekran Gösterim Tipleri
Web Prototip Hazırlama
Notify Ekleme
Preview Alma
Web Arayüz Tasarımına Giriş
Web Ekran Tasarımlarına Giriş
Registration Ekran Tasarımı
Header Tasarımı
Master Ekranlarla Çalışma
Menü Tasarımı
Dashboard Ekran Tasarımı
Listeleme Ekran Tasarımı
Form Ekran Tasarımı
Display Ekran Tasarımı
Elementler
Container Elementler
Date and Time Input Elementler
Display Elementler
Text Input Elementler
Numeric Input Elementler
Select Input Elementler
Data Elementler
Navigation Elementler
Interactive Elementler
Chart Elementler
Kuika'da Arayüz Tasarımına Giriş
Kuika Platformu'nda Kullanıcı Deneyimi
Uygulama Arayüz Tasarımı Süreci
Renklerle Çalışma
Boşlukların Tanımı
Yazı Stilleriyle Çalışma
Kompleks Stillerle Çalışma
Mock Data ile Çalışma
Konsept Tasarımı
Wireframe İlk Fikrin Görselleştirilmesi
Konsept Tasarımlarının Hazırlanması
UX Tasarımı
Kullanılabilirlik İlkeleri
Temel Tasarım İlkeleri
Bilgi Mimarisi
Ekranlar Arası Akış
Analiz ve Planlama
Proje Kapsamını ve Hedeflerini Tanımlama
Analiz Dokümanının Okunması
Örnek Diagramlarla Akış Okuma ve İhtiyaçların Tanımlanması
Projenin Planlanması
Designer Eğitim Seti Giriş
Low-Code Nedir?
Kuika Nedir?
Kuika ile Neler Yapabilirsin?
Platform Arayüzünü İnceleyelim
Öğrenim Sürecini Anlamak