The AXML:
<Button
android:id="#+id/greenButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Green"
local:MvxBind="Click ShowColorCommand, CommandParameter='Green'"/>
and the ViewModel:
public class MainViewModel
: MvxViewModel
{
public ICommand ShowColorCommand
{
get
{
return new MvxCommand(() => ShowViewModel<ColorViewModel>(new { color = ??? } ));
}
}
}
How do I read/use the CommandParameter from the .axml ('Green') in my Command? What do I need to put inside the "???"
Any help appreciated
Use the generic MvxCommand<T> form - there's a string example in Using MvxCommand With CommandParameter binding
new MvxCommand<string>(param =>
{
if (param == "foo")
{
// do something
}
else if (param == "bar")
{
// do something else
}
});
Related
I want to display a list of Youtube Video using ListView and WebView. But Videos are not loaded.
WebView always shows An Error Occured as the picture below:
Currently I don't know how to bind URL directly to WebView in AXML file, therefor I customized a BindableWebView instead:
public class BindableWebView : WebView
{
public BindableWebView(Context context, IAttributeSet attrs)
: base(context, attrs)
{
}
private string _webViewContent;
public string WebViewContent
{
get { return _webViewContent; }
set
{
_webViewContent = value;
LoadHtmlString();
}
}
private void LoadHtmlString()
{
LoadData(WebViewContent, "text/html", "utf-8");
}
}
This is Layout AXML file:
<dc.AlphaLinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
local:MvxBind="Click ItemClickCommand">
<!--Video Thumbnail-->
<FrameLayout
android:layout_width="#dimen/ProductImageWidth"
android:layout_height="#dimen/ProductImageHeight"
android:layout_margin="#dimen/ExtraNewsImagePadding">
<BindableWebView
android:id="#+id/playerWebView"
android:layout_width="match_parent"
android:layout_height="match_parent"
local:MvxBind="WebViewContent Video.YoutubeUrl" />
</FrameLayout>
<LinearLayout
.....
</LinearLayout>
</dc.AlphaLinearLayout>
This is Video Model:
namespace ....Shared.Models
{
public class Video
{
public string YoutubeId { get; set; }
public string YoutubeImageUrl => $"https://img.youtube.com/vi/{YoutubeId}/0.jpg";
public string YoutubeUrl => $"<iframe width=\"100%\" height=\"100%\" src=\"https://www.youtube.com/embed/{YoutubeId}\" frameborder=\"0\" allowfullscreen></iframe>";
public Guid NewsId { get; set; }
}
}
And VideoListViewm in C#:
namespace DeHeus.Droid.Views
{
public class VideoListView : DetailViewWithShare
{
protected override int LayoutId => Resource.Layout.VideoListView;
private CustomMvxListView _videoListview;
protected override void InitView(View view)
{
_videoListview = view.FindViewById<CustomMvxListView>(Resource.Id.videoList);
_videoListview.ItemTemplateId = Resource.Layout.VideoListItemView;
}
protected override void CreateBinding()
{
var bindingSet = this.CreateBindingSet<VideoListView, VideoListViewModel>();
bindingSet.Bind(_videoListview.Adapter)
.For(v => v.ItemsSource)
.To(vm => vm.VideoItemViewModels);
bindingSet.Bind(_videoListview)
.For(v => v.ScrollToBottom)
.To(vm => vm.ScrollToBottomCommand);
bindingSet.Apply();
}
}
}
Running debug, the WebViewContent gets exact Url but I don't know why it doesn't work as I thought: "<iframe width=\"100%\" height=\"100%\" src=\"https://www.youtube.com/embed/usoFYAqOMyA\" frameborder=\"0\" allowfullscreen></iframe>"
Does anyone has idea?
Thanks
Done a lot of researching and I have finally solved the issue.
All you need is putting SetWebChromeClient(new WebChromeClient()); before LoadData
public BindableWebView(Context context, IAttributeSet attrs)
: base(context, attrs)
{
WebSettings settings = this.Settings;
settings.JavaScriptEnabled = true;
SetWebChromeClient(new WebChromeClient());
}
private string _webViewContent;
public string WebViewContent
{
get { return _webViewContent; }
set
{
_webViewContent = value;
LoadHtmlString();
}
}
private void LoadHtmlString()
{
LoadData(WebViewContent, "text/html", "utf-8");
}
I am new to MvvmCross, I have a question with regards to binding in Android. I can bind to single property but unable to data bind to an object. Not sure what I am doing wrong but here it is:
Model class:
public class Login : MvxNotifyPropertyChanged
{
private string _email;
public string Email
{
get { return _email; }
set
{
SetProperty(ref _email, value);
}
}
public string Password { get; set; }
}
Snippet of View Model Class:
public class LoginOptionViewModel: MvxViewModel
{
private readonly IMvxNavigationService _navigationService;
public LoginOptionViewModel(IMvxNavigationService navigationService)
{
_navigationService = navigationService;
LoginCommand =
new MvxAsyncCommand(async () => await _navigationService.Navigate<RegistrationViewModel>());
}
public IMvxAsyncCommand LoginCommand { get; set; }
private Login _loginInfo;
public Login LoginInfo
{
get
{
return _loginInfo ?? new Login();
}
set
{
_loginInfo = value;
RaisePropertyChanged(() => LoginInfo);
}
}
}
Snippet of Android Axml:
<EditText
android:id="#+id/loginEmailTxt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/EmailHint"
android:textColor="#color/darkNavy"
android:inputType="textEmailAddress"
local:MvxBind="Text LoginInfo.Email" />
Where am I going wrong, I have placed a breakpoint but do not see it being hit. This is binded to EditText but nothing appears to happen. Am I missing or doing something wrong in order to bind to an object property ?
MvvmCross object data binding
You could implement the MvxNotifyPropertyChanged interface, so the system could notifies clients that a property value has changed.
Modify your object to :
public class Login : MvxNotifyPropertyChanged
{
private string _email;
public string Email
{
get => _email;
set => SetProperty(ref _email, value);
}
}
In the MainViewModel :
private Login _login;
public Login Login
{
get
{
return _login ?? new Login() { Email = "=-="};
}
set
{
_login = value;
RaisePropertyChanged(() => Login);
}
}
Then use it in axml :
local:MvxBind="Text Login.Email"
It works fine on my side.
Update :
I cant reproduce your problem, but here is my complete code, hope this can help you :
public class MainViewModel : MvxViewModel
{
public MainViewModel()
{
}
public override Task Initialize()
{
return base.Initialize();
}
public IMvxCommand ResetTextCommand => new MvxCommand(ResetText);
private void ResetText()
{
Text = "Hello MvvmCross";
}
private string _text = "Hello MvvmCross";
public string Text
{
get { return _text; }
set { SetProperty(ref _text, value); }
}
private Login _login;
public Login Login
{
get
{
return _login ?? new Login() { Email = "=-="};
}
set
{
_login = value;
RaisePropertyChanged(() => Login);
}
}
}
public class Login : MvxNotifyPropertyChanged
{
private string _email;
public string Email
{
get => _email;
set => SetProperty(ref _email, value);
}
}
Effect.
I'm creating app in UWP and i have question.
Can I somehow connection MVVM Light with SelectionChanged event (e.g. ListView) or with other event?
I would like that when I will click on some Item in ListView then I call SelectionChanged.
How do I do?
You can write the Method in ViewModel ,and use the x:bind to connection ViewModel.
The MVVMLight's method is use in WPF that cant bind the event in Method.
UWP can use x:bind to bind the UI event to ViewModel.
The sample:
XAML:
<ListView SelectionChanged = "{x:bind view.SelectionChanged }"/>
XAML.cs:
private ViewModel View{set;get;}
ViewModel:
public void SelectionChanged()
{
}
You can use ItemClick event that will run when you click the ListViewItem .
Inside your viewmodel something *.cs
public class RelayCommand : ICommand
{
private Predicate<object> _canExecute;
private Action<object> _execute;
public RelayCommand(Predicate<object> canExecute, Action<object> execute)
{
this._canExecute = canExecute;
this._execute = execute;
}
public event EventHandler CanExecuteChanged
{
add { CommandManager.RequerySuggested += value; }
remove { CommandManager.RequerySuggested -= value; }
}
public bool CanExecute(object parameter)
{
return _canExecute(parameter);
}
public void Execute(object parameter)
{
_execute(parameter);
}
}
public class MyViewModel
{
private ICommand _doSelectionChangedCommand;
public ICommand DoSelectionChangedCommand
{
get
{
if (_doSelectionChangedCommand == null)
{
_doSelectionChangedCommand = new RelayCommand(
p => this.CanSelectionChanged,
p => this.DoSomeImportantMethod());
}
return _doSomething;
}
}
}
In your viewSomemthing.xaml
--For namespace
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
--Then go down to your control, we'll use Combobox as an example
<ComboBox ... />
<i:Interaction.Triggers>
<EventTrigger EventName="SelectionChanged">
<i:InvokeCommandAction Command="{Binding DoSelectionChangedCommand}"/>
</EventTrigger>
</i:Interaction.Triggers>
</ComboBox>
In my example below I want to bind an ItemClick Command to the Item in the MvxListView.
Here I have in my ViewModel a List of Person that contains a List of Dog.
The ItemsSource HasDogs binding works fine.
When MvvmCross is trying to bind ItemClick SelectDogCommand to the ICommand in the Viewmodel I get this Exception.
[0:]
MvxBind:Warning: 11,30 Unable to bind: source property source not found Property:SelectDogCommand on Person
[0:] MvxBind:Warning: 11,30 Unable to bind: source property source not found Property:SelectDogCommand on Person
12-04 15:05:03.062 I/mono-stdout(16338): MvxBind:Warning: 11,30 Unable to bind: source property source not found Property:SelectDogCommand on Person
Hope you can Help.
Here is my example:
public class FirstViewModel:MvxViewModel
{
private List<Person> _persons;
public List<Person> Persons
{
get { return _persons; }
set { _persons = value; }
}
private Cirrious.MvvmCross.ViewModels.MvxCommand<Dog> _selectDog;
public System.Windows.Input.ICommand SelectDogCommand
{
get
{
_selectDog = _selectDog ?? new Cirrious.MvvmCross.ViewModels.MvxCommand<Dog>(SelectDog);
return _selectDog;
}
}
private void SelectDog(Dog item)
{
ShowViewModel<DetailViewModel>(new DetailViewModel.Parameters{dog = item});
}
}
public class Person
{
private string _name;
private List<Dog> _hasDogs;
public List<Dog> HasDogs
{
get { return _hasDogs; }
set { _hasDogs = value; }
}
public string Name
{
get { return _name; }
set { _name = value; }
}
}
public class Dog{...}
The Android View Xml:
FirstView:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
...>
<TextView ...
local:MvxBind="Text Persons"
<Mvx.MvxListView
...
local:MvxBind="ItemsSource Persons"
local:MvxItemTemplate="#layout/item_person" />
</LinearLayout>
item_person:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
...
android:layout_height="200dp">
<TextView
...
local:MvxBind="Text Name" />
<Mvx.MvxListView
...
local:MvxBind="ItemsSource HasDogs; ItemClick SelectDogCommand"
local:MvxItemTemplate="#layout/item_dog" />
</LinearLayout>
The DataContext for your person list item is a Person - so your SelectDogCommand needs to be part of the Person class - e.g. something like:
public class Person
{
private string _name;
private List<Dog> _hasDogs;
public List<Dog> HasDogs
{
get { return _hasDogs; }
set { _hasDogs = value; }
}
public string Name
{
get { return _name; }
set { _name = value; }
}
private Cirrious.MvvmCross.ViewModels.MvxCommand<Dog> _selectDog;
public System.Windows.Input.ICommand SelectDogCommand
{
get
{
_selectDog = _selectDog ?? new Cirrious.MvvmCross.ViewModels.MvxCommand<Dog>(dog => _parent.SelectDog(dog));
return _selectDog;
}
}
private FirstViewModel _parent;
public Person(FirstViewModel parent)
{
_parent = parent;
}
}
or alternatively you could get Person to inherit from MvxNavigatingObject (or MvxPropertyChanged or MvxViewModel) - in which case the ShowViewModel methods will be available there too.
I have a POJO named "FlashCard" which has a field named "links" which is collection (set) of Link objects. When I submit a FORM to my Action all the POJO fields are populated with values from the form except the collection of "links". I have no idea why this isn't getting populated.
Any advice on how to resolve this problem or how to better troubleshoot it would be much appreciated.
Also, my POJO's collection is a Set. Does it matter (or complicate things) that I'm using a Set and not a List?
I'm including a simplified version of my code below.
Here's my POJO:
public class FlashCard implements java.io.Serializable {
private int flashCardId;
private String question;
private String answer;
private Set<Link> links = new HashSet<Link>(0);
public FlashCard() {
}
public FlashCard(String question, String answer) {
this.question = question;
this.answer = answer;
}
public FlashCard(String question, String answer, Set<Link> links) {
this.question = question;
this.answer = answer;
this.links = links;
}
public int getFlashCardId() {
return this.flashCardId;
}
public void setFlashCardId(int flashCardId) {
this.flashCardId = flashCardId;
}
public String getQuestion() {
return this.question;
}
public void setQuestion(String question) {
this.question = question;
}
public String getAnswer() {
return this.answer;
}
public void setAnswer(String answer) {
this.answer = answer;
}
public Set<Link> getLinks() {
return this.links;
}
public void setLinks(Set<Link> links) {
this.links = links;
}
}
Here's the POJO for the Link object:
public class Link implements java.io.Serializable {
private int linkId;
private String url;
private Set<FlashCard> flashcards = new HashSet<FlashCard>(0);
public Link() {
}
public Link(String url) {
this.url = url;
}
public Link(String url, Set<FlashCard> flashcards) {
this.url = url;
this.flashcards = flashcards;
}
public int getLinkId() {
return this.linkId;
}
public void setLinkId(int linkId) {
this.linkId = linkId;
}
public String getUrl() {
return this.url;
}
public void setUrl(String url) {
this.url = url;
}
public Set<FlashCard> getFlashcards() {
return this.flashcards;
}
public void setFlashcards(Set<FlashCard> flashcards) {
this.flashcards = flashcards;
}
}
Here's the relevant part of the Action
public class FlashCardAction extends FlashCardsAppBaseAction implements ModelDriven<FlashCard>, Preparable, SessionAware {
static Logger logger = Logger.getLogger(FlashCardAction.class);
FlashCard flashCard = new FlashCard();
Map <String,Object> httpSession;
Session session;
FlashCardPersister fcPersister;
public Map<String, Object> getHttpSession() {
return httpSession;
}
public FlashCard getFlashCard() {
return this.flashCard;
}
public void setFlashCard(FlashCard flashCard) {
this.flashCard = flashCard;
}
public void validate() {
logger.debug("Entering validate()");
if ( flashCard.getQuestion().length() == 0 ){
addFieldError("flashCard.question", getText("error.flashcard.question"));
}
if ( flashCard.getAnswer().length() == 0 ) {
addFieldError("flashCard.answer", getText("error.flashcard.answer"));
}
}
public String saveOrUpdate() {
logger.debug("Entering saveOrUpdate()");
// assume we'll fail
boolean result = false;
// are we creating a New Flash Card or Updating and existing one
// for now, let's assume we are creating a New Flash Card
boolean newFlashCard = true;
// if this is an Update of an existing Flash CArd then we'll have a Flash Card Id other than 0
if (this.flashCard.getFlashCardId() != 0) {
newFlashCard = false;
}
try {
result = fcPersister.saveOrUpdateFlashCard(this.flashCard, session);
// did we save a new FlashCard successfully?
if (result == true && newFlashCard) {
logger.debug("Flash Card created successfully");
this.addActionMessage(getText("actionmessage.flashcard.created"));
}
// did we update an existing Flash Card successfully?
else if (result == true && newFlashCard == false) {
logger.debug("Flash Card updated successfully");
this.addActionMessage(getText("actionmessage.flashcard.updated"));
}
// such a failure
else {
logger.error("unable to create or update FlashCard");
return "error";
}
return "success";
} catch (Exception e) {
logger.error("Exception in createFlashCard():", e);
return "error";
}
}
#Override
public FlashCard getModel() {
return this.flashCard;
}
#Override
public void setSession(Map<String, Object> httpSession) {
this.httpSession = httpSession;
}
#Override
public void prepare() throws Exception {
logger.debug("Entering prepare()");
// get a handle to a Hibernate session
session = getHibernateSession();
// get a handle to the FlashCard persistance utility class
fcPersister = new FlashCardPersister();
}
}
And lastly here's the JSP
<%#page import="com.opensymphony.xwork2.ActionContext"%>
<%#page import="com.opensymphony.xwork2.ActionSupport"%>
<%# page contentType="text/html; charset=UTF-8"%>
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sjr" uri="/struts-jquery-richtext-tags"%>
<h3><s:text name="label.flashcard.title"/></h3>
<s:actionerror theme="jquery" />
<s:actionmessage theme="jquery"/>
<s:fielderror theme="jquery"/>
<s:form action="saveOrUpdate" method="post">
<s:hidden name="flashCard.flashCardId" />
<s:textfield name="flashCard.question" key="label.flashcard.question" size="66" />
<sjr:tinymce
id="flashCard.answer"
name="flashCard.answer"
key="label.flashcard.answer"
rows="20"
cols="50"
editorTheme="simple"
/>
<s:textfield name="flashCard.links.url" key="label.flashcard.link" size="66" />
<tr>
<td>
<s:submit label="label.flashcard.submit" align="center" theme="simple" />
</td>
<td>
<s:submit key="label.flashcard.cancel" name="redirectAction:list" theme="simple" />
</td>
</tr>
</s:form>
<%((ActionSupport)ActionContext.getContext().getActionInvocation().getAction()).clearErrorsAndMessages();%>
First of all I don't think you can use Set here, because Sets are unordered and you can't get an item from a set by an index or key like List and Map. The only way is to iterate through the set and get the items.
Second assuming you're using a collection other than set, in:
<s:textfield name="flashCard.links.url" key="label.flashcard.link" size="66"/>
You try to set the value of the text field to url field of links which is a collection and doesn't have such a field. So you need to get the specific item from the collection you're editing and pass the value. Like:
<s:textfield name="flashCard.links[0].url" key="label.flashcard.link" size="66"/>
But since you can't get the specific item you are editing I suggest you create a link field in your Action and set the updated link to it. Then you can perform a logic to relace the updated link with obsolete one in you flashcards. Hope this helps.
Since you are using modeldriven and the model is FlashCard, i think the following
<sjr:tinymce
id="flashCard.answer"
name="flashCard.answer"
key="label.flashcard.answer"
rows="20"
cols="50"
editorTheme="simple"/>
should be changed to
<sjr:tinymce
id="flashCard.answer"
name="answer"
key="label.flashcard.answer"
rows="20"
cols="50"
value="answer"
editorTheme="simple"/>
the name field should be given without the prefix flashcard.also you should provide the 'value' attribute in order for it to be pre-populated.