Basic newbie question:
I want to sync/bind two tables.
For keeping the example simple, I have used two separate table views. This needs to be done using fragments and scope, which I thought would complicate the question as I am stuck at a basic problem.
Behaviour: On clicking the sync button of table 1 , I want table 1 selected data to override the corresponding table 2 data. and vice-versa
Person Model:
class Person(firstName: String = "", lastName: String = "") {
val firstNameProperty = SimpleStringProperty(firstName)
var firstName by firstNameProperty
val lastNameProperty = SimpleStringProperty(lastName)
var lastName by lastNameProperty
}
class PersonModel : ItemViewModel<Person>() {
val firstName = bind { item?.firstNameProperty }
val lastName = bind { item?.lastNameProperty }
}
Person Controller (dummy data):
class PersonController : Controller(){
val persons = FXCollections.observableArrayList<Person>()
val newPersons = FXCollections.observableArrayList<Person>()
init {
persons += Person("Dead", "Stark")
persons += Person("Tyrion", "Lannister")
persons += Person("Arya", "Stark")
persons += Person("Daenerys", "Targaryen")
newPersons += Person("Ned", "Stark")
newPersons += Person("Tyrion", "Janitor")
newPersons += Person("Arya", "Stark")
newPersons += Person("Taenerys", "Dargaryen")
}
}
Person List View:
class PersonList : View() {
val ctrl: PersonController by inject()
val model : PersonModel by inject()
var personTable : TableView<Person> by singleAssign()
override val root = VBox()
init {
with(root) {
tableview(ctrl.persons) {
personTable = this
column("First Name", Person::firstNameProperty)
column("Last Name", Person::lastNameProperty)
columnResizePolicy = SmartResize.POLICY
}
hbox {
button("Sync") {
setOnAction {
personTable.bindSelected(model)
//model.itemProperty.bind(personTable.selectionModel.selectedItemProperty())
}
}
}
}
}
Another Person List View:
class AnotherPersonList : View() {
val model : PersonModel by inject()
val ctrl: PersonController by inject()
override val root = VBox()
var newPersonTable : TableView<Person> by singleAssign()
init {
with(root) {
tableview(ctrl.newPersons) {
newPersonTable = this
column("First Name", Person::firstNameProperty)
column("Last Name", Person::lastNameProperty)
columnResizePolicy = SmartResize.POLICY
}
hbox {
button("Sync") {
setOnAction {
newPersonTable.bindSelected(model)
}
}
}
}
}
}
First we need to be able to identify a Person, so include equals/hashCode in the Person object:
class Person(firstName: String = "", lastName: String = "") {
val firstNameProperty = SimpleStringProperty(firstName)
var firstName by firstNameProperty
val lastNameProperty = SimpleStringProperty(lastName)
var lastName by lastNameProperty
override fun equals(other: Any?): Boolean {
if (this === other) return true
if (other?.javaClass != javaClass) return false
other as Person
if (firstName != other.firstName) return false
if (lastName != other.lastName) return false
return true
}
override fun hashCode(): Int {
var result = firstName.hashCode()
result = 31 * result + lastName.hashCode()
return result
}
}
We want to fire an event when you click the Sync button, so we define an event that can contain both the selected person and the row index:
class SyncPersonEvent(val person: Person, val index: Int) : FXEvent()
You cannot inject the same PersonModel instance and use bindSelected in both views, since that will override each other. Also, bindSelected will react whenever the selection changes, not when you call bindSelected itself, so it doesn't belong in the button handler. We'll use a separate model for each view and bind towards the selection. Then we can easily know what person is selected when the button handler runs, and we don't need to hold on to an instance of the TableView. We'll also use the new root builder syntax to clean up everything. Here is the PersonList view:
class PersonList : View() {
val ctrl: PersonController by inject()
val selectedPerson = PersonModel()
override val root = vbox {
tableview(ctrl.persons) {
column("First Name", Person::firstNameProperty)
column("Last Name", Person::lastNameProperty)
columnResizePolicy = SmartResize.POLICY
bindSelected(selectedPerson)
subscribe<SyncPersonEvent> { event ->
if (!items.contains(event.person)) {
items.add(event.index, event.person)
}
if (selectedItem != event.person) {
requestFocus()
selectionModel.select(event.person)
}
}
}
hbox {
button("Sync") {
setOnAction {
selectedPerson.item?.apply {
fire(SyncPersonEvent(this, ctrl.persons.indexOf(this)))
}
}
}
}
}
}
The AnotherPersonList view is identical except for the reference to ctrl.newPersons instead of ctrl.persons in two places. (You might use the same fragment and send in the list as a parameter so you don't need to duplicate all this code).
The sync button now fires our event, provided that a person is selected at the time of the button click:
selectedPerson.item?.apply {
fire(SyncPersonEvent(this, ctrl.persons.indexOf(this)))
}
Inside the TableView we now subscribe to the SyncPersonEvent:
subscribe<SyncPersonEvent> { event ->
if (!items.contains(event.person)) {
items.add(event.index, event.person)
}
if (selectedItem != event.person) {
requestFocus()
selectionModel.select(event.person)
}
}
The sync event is notified when the event fires. It first checks if the items of for the tableview contains this person, or adds it at the correct index if not. A real application should check that the index is within the bounds of the items list.
Then it checks if this person is selected already and if not it will make the selection and also request focus to this table. The check is important so that the source table doesn't also request focus or perform the (redundant) selection.
As noted, a good optimization would be to send in the items list as a parameter so that you don't need to duplicate the PersonList code.
Also notice the use of the new builder syntax:
override val root = vbox {
}
This is much neater than first declaring the root node as a VBox() and when building the rest of the UI in the init block.
Hope this is what you're looking for :)
Important: This solution requires TornadoFX 1.5.9. It will be released today :) You can build against 1.5.9-SNAPSHOT in the mean time if you like.
Another option you have is RxJavaFX/RxKotlinFX. I have been writing a companion guide for these libraries just like the TornadoFX one.
When you have to deal with complex event streams and keeping UI components synchronized, reactive programming is effective for these situations.
package org.nield.demo.app
import javafx.beans.property.SimpleStringProperty
import javafx.collections.FXCollections
import javafx.collections.ObservableList
import rx.javafx.kt.actionEvents
import rx.javafx.kt.addTo
import rx.javafx.kt.onChangedObservable
import rx.javafx.sources.CompositeObservable
import rx.lang.kotlin.toObservable
import tornadofx.*
class MyApp: App(MainView::class)
class MainView : View() {
val personList: PersonList by inject()
val anotherPersonList: AnotherPersonList by inject()
override val root = hbox {
this += personList
this += anotherPersonList
}
}
class PersonList : View() {
val ctrl: PersonController by inject()
override val root = vbox {
val table = tableview(ctrl.persons) {
column("First Name", Person::firstNameProperty)
column("Last Name", Person::lastNameProperty)
//broadcast selections
selectionModel.selectedIndices.onChangedObservable()
.addTo(ctrl.selectedLeft)
columnResizePolicy = SmartResize.POLICY
}
button("SYNC").actionEvents()
.flatMap {
ctrl.selectedRight.toObservable()
.take(1)
.flatMap { it.toObservable() }
}.subscribe {
table.selectionModel.select(it)
}
}
}
class AnotherPersonList : View() {
val ctrl: PersonController by inject()
override val root = vbox {
val table = tableview(ctrl.newPersons) {
column("First Name", Person::firstNameProperty)
column("Last Name", Person::lastNameProperty)
//broadcast selections
selectionModel.selectedIndices.onChangedObservable()
.addTo(ctrl.selectedRight)
columnResizePolicy = SmartResize.POLICY
}
button("SYNC").actionEvents()
.flatMap {
ctrl.selectedLeft.toObservable()
.take(1)
.flatMap { it.toObservable() }
}.subscribe {
table.selectionModel.select(it)
}
}
}
class Person(firstName: String = "", lastName: String = "") {
val firstNameProperty = SimpleStringProperty(firstName)
var firstName by firstNameProperty
val lastNameProperty = SimpleStringProperty(lastName)
var lastName by lastNameProperty
}
class PersonController : Controller(){
val selectedLeft = CompositeObservable<ObservableList<Int>> { it.replay(1).autoConnect().apply { subscribe() } }
val selectedRight = CompositeObservable<ObservableList<Int>> { it.replay(1).autoConnect().apply { subscribe() } }
val persons = FXCollections.observableArrayList<Person>()
val newPersons = FXCollections.observableArrayList<Person>()
init {
persons += Person("Dead", "Stark")
persons += Person("Tyrion", "Lannister")
persons += Person("Arya", "Stark")
persons += Person("Daenerys", "Targaryen")
newPersons += Person("Ned", "Stark")
newPersons += Person("Tyrion", "Janitor")
newPersons += Person("Arya", "Stark")
newPersons += Person("Taenerys", "Dargaryen")
}
}
Related
I want to create chat app UI using ViewModel but when I send button the List in ViewModel update but LayzColumn not update it data. I don't know why it's not working.
My ChatViewModel
class ChatViewModel: ViewModel() {
private val _messages: MutableLiveData<MutableList<String>> = MutableLiveData(mutableListOf(""))
val messages: LiveData<MutableList<String>> get() = _messages
fun add(message: String) {
_messages.value?.add(message)
Log.d("Haha", "${_messages.value?.size}")
_messages.notifyObserver()
}
}
fun <T> MutableLiveData<T>.notifyObserver() {
this.value = value
}
My LazyColumn
val messages by chatViewModel.messages.observeAsState(mutableListOf(""))
LazyColumn(modifier = Modifier
.fillMaxWidth()
.weight(1f)
) {
items(messages.toList()) { message ->
SenderChat(message = message)
}
}
I have one activity with 2 recyclerViews, both recyclers are used with Firebase. One of the recyclers displays the results of a query, the other recycler has a listener that updates every time there is an update in Firebase. I added a searchView to filter the results from Firebase. The issue I'm having is when I'm trying to search the results from the Firebase query, when I start typing I see results but when I click the X to stop searching, the adapter does not reload the array and i don't see the list of items unless I reload the activity. I'm not sure what I'm missing here. Any help/suggestion is greatly appreciated. Here is my code:
Adapter
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Filter
import android.widget.Filterable
import android.widget.TextView
import androidx.recyclerview.widget.RecyclerView
import com.eduardoz.ezmdapp.Model.Charges
import com.eduardoz.ezmdapp.R
class ChargesAdapter (private var charges: ArrayList<Charges>
, private var chargesAll: ArrayList<Charges>
, private val itemClick: (Charges) -> Unit)
: RecyclerView.Adapter<ChargesAdapter.ViewHolder>()
, Filterable {
inner class ViewHolder(itemView: View, val itemClick: (Charges) -> Unit) :
RecyclerView.ViewHolder(itemView) {
private val chargeCode = itemView.findViewById<TextView>(R.id.chargeCodeTxt)
private val chargeDescription = itemView.findViewById<TextView>(R.id.chargeDescriptionTxt)
fun bindCharges(charges: Charges) {
chargeCode?.text = charges.chargeCode
chargeDescription?.text = charges.chargeDescription
itemView.setOnClickListener { itemClick(charges) }
}
}
init {
this.charges = charges
chargesAll = java.util.ArrayList(charges)
}
override fun getItemCount(): Int {
return charges.count()
}
override fun onBindViewHolder(holder: ChargesAdapter.ViewHolder, position: Int) {
holder.bindCharges(charges[position])
}
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ChargesAdapter.ViewHolder {
val view = LayoutInflater.from(parent.context).inflate(R.layout.charges_list, parent, false)
return ViewHolder(view, itemClick)
}
override fun getFilter(): Filter {
return searchFilter
}
private val searchFilter: Filter = object: Filter() {
override fun performFiltering(constraint: CharSequence?): FilterResults {
val filteredList: ArrayList<Charges> = ArrayList()
if (constraint!!.isEmpty()) {
filteredList.addAll(chargesAll)
} else {
for(item in chargesAll) {
if
(item.chargeDescription.toLowerCase().contains(constraint.toString().toLowerCase())) {
filteredList.add(item)
}
}
}
val searchResults = FilterResults()
searchResults.values = filteredList
return searchResults
}
override fun publishResults(constraint: CharSequence?, results: FilterResults?) {
charges.clear()
charges.addAll(results!!.values as Collection<Charges>)
notifyDataSetChanged()
}
}
}
Activity
descriptionSearch.setOnQueryTextListener(object : SearchView.OnQueryTextListener {
override fun onQueryTextSubmit(query: String): Boolean {
return false
}
override fun onQueryTextChange(newText: String): Boolean {
if (newText.isNotEmpty()) {
searchViewBar(newText)
} else {
if (newText.isEmpty()) { //I ADDED THIS TO RELOAD THE ADAPTER
charges.clear()
chargeList()
}
}
return false
}
})
private fun searchViewBar(newText: String) {
chargesListener = chargesCollectionRef
.whereGreaterThanOrEqualTo(CHARGE_DESCRIPTION, newText)
.whereLessThanOrEqualTo(CHARGE_DESCRIPTION, newText+"z")
.addSnapshotListener(this) { snapshot, exception ->
if (exception != null) {
println("error")
}
if (snapshot != null) {
charges.clear()
parseData(snapshot)
}
}
}
fun parseData(snapshot: QuerySnapshot) {
for (document in snapshot.documents) {
val data = document.data
val chargeCode = data!![CHARGE_CODE] as String
val chargeDescription = data[CHARGE_DESCRIPTION] as String
val chargeSpecialty = data[CHARGE_SPECIALTY] as String
val newChargeList = Charges(chargeCode, chargeDescription, chargeSpecialty)
charges.add(newChargeList)
}
chargesFromAdapter.notifyDataSetChanged()
}
I am very new using Kotlin and programming and I am currently making a calendar with events. My problem comes when I want to connect these events to firebase.
I am using an example that I found in git (https://github.com/kizitonwose/CalendarView) that uses the ThreeTen library for dates. This is the Event object:
class Event (val id: String, val text: String, val date: LocalDate) : Serializable
The data variable is of the LocalData type and this is what is causing me problems since it seems that Firebase only accepts variables of type String, Int, etc ...
I tried to pass the variable to String with toString and with Gson (), without success.
Here is the code if it helps
private val inputDialog by lazy {
val editText = AppCompatEditText(requireContext())
val layout = FrameLayout(requireContext()).apply {
// Setting the padding on the EditText only pads the input area
// not the entire EditText so we wrap it in a FrameLayout.
setPadding(20, 20, 20, 20)
addView(editText, FrameLayout.LayoutParams(MATCH_PARENT, WRAP_CONTENT))
}
AlertDialog.Builder(requireContext())
.setTitle(getString(R.string.example_3_input_dialog_title))
.setView(layout)
.setPositiveButton(R.string.save) { _, _ ->
saveEvent(editText.text.toString())
// Prepare EditText for reuse.
editText.setText("")
}
.setNegativeButton(R.string.close, null)
.create()
.apply {
setOnShowListener {
// Show the keyboard
editText.requestFocus()
context.inputMethodManager.toggleSoftInput(InputMethodManager.SHOW_FORCED, 0)
}
setOnDismissListener {
// Hide the keyboard
context.inputMethodManager.toggleSoftInput(InputMethodManager.HIDE_IMPLICIT_ONLY, 0)
}
}
}
private var selectedDate: LocalDate? = null
private val today = LocalDate.now()
private val titleSameYearFormatter = DateTimeFormatter.ofPattern("MMMM")
private val titleFormatter = DateTimeFormatter.ofPattern("MMM yyyy")
private val selectionFormatter = DateTimeFormatter.ofPattern("yyyy MM dd")
private val events = mutableMapOf<LocalDate, List<Event>>()
private var prueba = Gson().toJson(events)
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.fragment_calendar, container, false)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
mDatabaseReference = mDatabase!!.reference.child("events")
exThreeRv.layoutManager = LinearLayoutManager(requireContext(), RecyclerView.VERTICAL, false)
exThreeRv.adapter = eventsAdapter
exThreeRv.addItemDecoration(DividerItemDecoration(requireContext(), RecyclerView.VERTICAL))
val daysOfWeek = daysOfWeekFromLocale()
val currentMonth = YearMonth.now()
exThreeCalendar.setup(currentMonth.minusMonths(10), currentMonth.plusMonths(10), daysOfWeek.first())
exThreeCalendar.scrollToMonth(currentMonth)
if (savedInstanceState == null) {
exThreeCalendar.post {
// Show today's events initially.
selectDate(today)
}
}
class DayViewContainer(view: View) : ViewContainer(view) {
lateinit var day: CalendarDay // Will be set when this container is bound.
val textView = view.exThreeDayText
val dotView = view.exThreeDotView
init {
view.setOnClickListener {
if (day.owner == DayOwner.THIS_MONTH) {
selectDate(day.date)
}
}
}
}
exThreeCalendar.dayBinder = object : DayBinder<DayViewContainer> {
override fun create(view: View) = DayViewContainer(view)
override fun bind(container: DayViewContainer, day: CalendarDay) {
container.day = day
val textView = container.textView
val dotView = container.dotView
textView.text = day.date.dayOfMonth.toString()
if (day.owner == DayOwner.THIS_MONTH) {
textView.makeVisible()
when (day.date) {
today -> {
textView.setTextColorRes(R.color.white)
textView.setBackgroundResource(R.drawable.today_bg)
dotView.makeInVisible()
}
selectedDate -> {
textView.setTextColorRes(R.color.white)
textView.setBackgroundResource(R.drawable.selected_bg)
dotView.makeInVisible()
}
else -> {
textView.setTextColorRes(R.color.black)
textView.background = null
dotView.isVisible = events[day.date].orEmpty().isNotEmpty()
}
}
} else {
textView.makeInVisible()
dotView.makeInVisible()
}
}
}
exThreeCalendar.monthScrollListener = {
requireActivity().home.text = if (it.year == today.year) {
titleSameYearFormatter.format(it.yearMonth)
} else {
titleFormatter.format(it.yearMonth)
}
// Select the first day of the month when
// we scroll to a new month.
selectDate(it.yearMonth.atDay(1))
}
class MonthViewContainer(view: View) : ViewContainer(view) {
val legendLayout = view.legendLayout
}
exThreeCalendar.monthHeaderBinder = object : MonthHeaderFooterBinder<MonthViewContainer> {
override fun create(view: View) = MonthViewContainer(view)
override fun bind(container: MonthViewContainer, month: CalendarMonth) {
// Setup each header day text if we have not done that already.
if (container.legendLayout.tag == null) {
container.legendLayout.tag = month.yearMonth
container.legendLayout.children.map { it as TextView }.forEachIndexed { index, tv ->
tv.text = daysOfWeek[index].name.first().toString()
tv.setTextColorRes(R.color.black)
}
}
}
}
exThreeAddButton.setOnClickListener {
inputDialog.show()
}
}
private fun selectDate(date: LocalDate) {
if (selectedDate != date) {
val oldDate = selectedDate
selectedDate = date
oldDate?.let { exThreeCalendar.notifyDateChanged(it) }
exThreeCalendar.notifyDateChanged(date)
updateAdapterForDate(date)
}
}
private fun saveEvent(text: String) {
if (text.isBlank()) {
Toast.makeText(requireContext(),
R.string.example_3_empty_input_text, Toast.LENGTH_LONG).show()
} else {
selectedDate?.let {
events[it] = events[it].orEmpty().plus(
Event(
UUID.randomUUID().toString(),
text,
it
)
)
uploadFirebase()
updateAdapterForDate(it)
}
}
}
private fun deleteEvent(event: Event) {
val date = event.date
events[date] = events[date].orEmpty().minus(event)
updateAdapterForDate(date)
}
private fun updateAdapterForDate(date: LocalDate) {
eventsAdapter.events.clear()
eventsAdapter.events.addAll(events[date].orEmpty())
eventsAdapter.notifyDataSetChanged()
exThreeSelectedDateText.text = selectionFormatter.format(date)
}
fun uploadFirebase(){
val newEvent = mDatabaseReference.push()
newEvent.setValue(events)
}
override fun onStart() {
super.onStart()
}
override fun onStop() {
super.onStop()
}
}
There is no way you can add a property of type LocalDate in a Firebase Realtime database because it is not a supported data-type. However, there are two ways in which you can solve this:
You save the date as a ServerValue.TIMESTAMP, which basically means that you save the number of seconds that have elapsed since the Unix epoch. In this case, the server writes the current date in the database. To achieve this, please see my answer from the following post:
How to save the current date/time when I add new value to Firebase Realtime Database
You specify a custom long value for your date field. In this case, it's up to you to determine what date is written.
Unfortunately, there is no way you can combine these two options, you can use one or the other.
When talking about a LocalDate, we usually talk about an offset, in which case, this what I'll do. I'll store a Timestamp property, as explained at point one, that will let the server populate with the server Timestamp, as well as an offset property, that should be populated with the offset in days/hours.
I am new in xamarin and I am trying to make xamarin.form app which contains sqlite database. So I know that the table is created once but also I have some records that I need to be in that table by default. I mean when table is created the data also must be initialized with it once. According to tutorial I have a class to handle the database called DataAccess.cs
class DataAccess : IDisposable
{
public void Dispose()
{
database.Dispose();
}
private SQLiteConnection database;
public ObservableCollection<DataModel> dataz { get; set; }
private static object collisionLock = new object();
public DataAccess()
{
database = DependencyService.Get<IConfig>().DbConnection();
database.CreateTable<DataModel>();
//database.Insert(new DataModel { Did = 1 , Data = "aaaa"});
//database.Insert(new DataModel { Did = 2, Data = "bbb" });
//database.Insert(new DataModel { Did = 3, Data = "ccc" });
this.dataz = new ObservableCollection<DataModel>(database.Table<DataModel>());
if (!database.Table<DataModel>().Any())
{
addNewData();
}
}
public void addNewData()
{
this.dataz.Add(new DataModel { Did = 1, Data = "aa" });
}
public void SaveData(DataModel record)
{
lock (collisionLock)
{
database.Insert(record);
}
}
public DataModel GetDataById(int id)
{
lock (collisionLock)
{
return database.Table<DataModel>().
FirstOrDefault(x => x.Did == id);
}
}
public List<DataModel> GeyAllData()
{
return database.Table<DataModel>().ToList();
}
}
Since the table is created in above class instructor. So I tried to initialized data there but data added to table on each run. So I confused how to initialize data on first run only.
You could go one of two ways.
1: Check if the table does not exist yet and if not, create it and add your data
var result = await conn.ExecuteScalarAsync<int>("SELECT count(*) FROM sqlite_master WHERE type='table' AND name='DataModel';", new string[] { });
if (result == 0)
{
await conn.CreateTableAsync<DataModel>();
// Insert your initial data
}
2: Always check if the data exists and insert it if it does not
FYI: Assuming Did is your PrimaryKey of DataModel
var row = await conn.FindAsync<Record>(1);
if (row == null)
{
// Insert the "Did = 1" row
}
I am trying to bind two views of viewmodel to two tabs of tab control by editing sample source code Caliburn.Micro.SimpleMDI included with Caliburn.Micro source. This project contains ShellViewModel and TabViewModel with TabView. I added one View named TabViewDetails. I edited ShellViewModel as follows.
public class ShellViewModel : Conductor<IScreen>.Collection.OneActive
{
int count = 1;
public void OpenTab()
{
TabViewModel vm = null;
if (Items.Count != 0)
{
vm = new TabViewModel() { DisplayName = "Detail Tab " + count++ };
var secondView = new TabViewDetails();
ViewModelBinder.Bind(vm, secondView , null);
}
else
{
vm = new TabViewModel() { DisplayName = "Tab " + count++ };
}
ActivateItem(vm);
}
}
First tab is Ok. But the second tab shows nothing.Can anybody help to figure out the problem?.
I haven't used Caliburn.Micro much but the simple solution is one view, one view model. If you change your code to something like:
public class ShellViewModel : Conductor<IScreen>.Collection.OneActive {
int count = 1;
public void OpenTab()
{
Screen screen;
if (count != 0)
{
screen = new TabViewModel
{
DisplayName = "Tab " + _count++
};
}
else
{
screen = new TestViewModel
{
DisplayName = "Tab " + _count++
};
}
ActivateItem(screen);
}
}
where TestViewModel can be a TabViewModel
public class TestViewModel : TabViewModel
{
}
then this works ok.
The Caliburn docs does have a section multiple views over the same viewmodel but I haven't figured that out yet.