Wicket Create New Tabs on Runtime - ajax

I've got a problem with creating new Tabs in Wicket on Runtime. When I add a new tab to the list of Tabs of my AjaxTabbedBar, I don't see any changes on the screen, maybe you can help me?
ExamplePage extends Webpage:
private AjaxTabbedPanel<AbstractTab> myTabBar;
tabs = new ArrayList<AbstractTab>();
tabs.add(new AbstractTab(new Model<String>("Übersicht")) {
private static final long serialVersionUID = 1L;
#Override
public Panel getPanel(String panelId) {
if (myOverviewTab == null) myOverviewTab = new OverviewTab(panelId, getInstance());
return myOverviewTab;
}
});
tabs.add(new AbstractTab(new Model<String>("Details")) {
private static final long serialVersionUID = 1L;
#Override
public Panel getPanel(String panelId) {
if (myDetailTab == null) myDetailTab = new DetailTab(panelId);
return myDetailTab;
}
});
myTabBar = new AjaxTabbedPanel<AbstractTab>("tabs", tabs);
add(myTabBar);
This is where I create the tabs on start and here comes my Runtimeaddition
public void newDetailTab(AjaxRequestTarget target){
System.out.println("newDetailtab");
tabs.add(new AbstractTab(new Model<String>("Details")) {
private static final long serialVersionUID = 1L;
#Override
public Panel getPanel(String panelId) {
return new DetailTab(panelId);
}
});
myTabBar.setSelectedTab(myTabBar.getSelectedTab()+1);
target.add(myTabBar);
}
So in the last line I want to change my actual tab, but actually it doesn't works. What makes me wonder is that the first tab has the number -1 (myTabBar.getSelectedtTab()), is this an error?
i also tried to update my tabbar with an AjaxRequestTarget, but there come different errors: cant update a page or Component with id [[tabs28]] was not found while trying to perform...
Hope you can help me.
edit: I found some people on google with an similiar problem, they tried to use LoadabledetachableModel... i just dont really know how to include this because its abstract, and i dont really know how to fill the methods these model wants to use...

So, i got it... Finally i had to use the AjaxRequestTarget from my function from the other class to refresh it directly... When i give that as a parameter there seems to be a fault. I think that this is the point but i'm not totally sure because i changed a lot :)

TabbedPanel starts out with -1 for its selected tab. On rending it will automatically select the first visible tab.
It seems to me you're working on a new TabbedPanel instance in #newDetailTab().

Generally you should add the new tab and then update the entire AjaxTabbedPanel with the AjaxRequestTarget.
"Cannot update component with id=XY" most of the time is indicating that you are missing setOutputMarkupPlaceholderTag(true) on the component you are trying to update via ajax.

Related

Vaadin 8.4.0 Modal for save confirmation after grid buffer save

We are using a grid to present some data. This grid is not using a data provider but setting its items.
We are working on buffered modd, but we still want to show a modal informing what are we about to save, with the posibility to save or cancel.
SaveEditor method has been removed from grid class in our current version (8.4.0), so cant do it that way.
I have come to a close solution but with some remaining problems.
I have extended grid component to be able to create my own editor:
public class MyGridComponent extends Grid<MyData> {
public MyGridComponent (Class<MyData> beanType) {
super(beanType);
}
#Override
protected Editor<MyData> createEditor() {
return new MyGridEditor(this.getPropertySet());
}
}
On my editor I have overriden following methods:
#Override
protected void doEdit(OutcomeWagerLimit bean) {
copyMyBean = bean;
super.doEdit(bean);
}
#Override
public boolean save() {
String desc = copyMyBean.getDescription();
StringBuilder captionBuilder = new StringBuilder()
.append("Save ")
.append(desc)
.append("?");
StringBuilder messageBuilder = new StringBuilder()
.append("Do you really want to save ")
.append(desc)
.append("?");
openConfirmMsgBox(captionBuilder.toString(), messageBuilder.toString(),() -> super.save(), ()->super.cancel());
return true;
}
With this code clicking on save opens my confirmation modal. If clicking on save, everything works flawlessly, but clicking on my modal cancel which will call to EditorImpl.cancel() method, acts in a weird way. Clicking cancel on my modal will close edition mode, but if I edit again any other row (double clicking on it) grid's save and cancel buttons (not the modal ones) stop working. Not launching any request from client to vaadin's servlet.
Does anyone know any possible solution to this or a better way to reach what I'm trying to achieve?
Thanks in advance
Morning,
Just managed to do it. Since not using dataprovider but normal list, I am the one responsible of saving data in other saveEventListener. That is the moment to present modal and in the "ok" case persist it in database.
So there is no need to override EditorImpl save method and do it in a saveEventListener.
Thanks

Persistent Storage using Application.Current.Properties not working

I'm trying to achieve a persistent storage in Xamarin.Forms. After researching in Xamarin.Forms, I decided to use Application.Current.Properties property.
It looks like it is working just only if the app still remains alive. If I close the app and start it again the Application.Current.Properties is empty.
Does anyone know if I'm doing something wrong? Can I achieve this feature in another way?
As usual, thanks guys.
I have had a ton of problems with Application.Current.Properties on Android. I highly suggest using Xamarin Settings plugin instead which I have never had any issues with. It is persistent even when the app is closed.
That being said Application.Current.Properties is supposed to work even when you close the app. Not sure why it wouldn't but it does not surprise me either.
*Edit: To use once it is installed, basically CrossSettings.Current is the plugin class that will do the work but the example just creates a separate property to access it. So create a new file, lets call it SettingsImplementation:
public static class SettingsImplementation {
#region Instance
private static Lazy<ISettings> _appSettings;
public static ISettings AppSettings {
get {
if(_appSettings == null) {
_appSettings = new Lazy<ISettings>(() => CrossSettings.Current, LazyThreadSafetyMode.PublicationOnly);
}
return _appSettings.Value;
}
set {
_appSettings = new Lazy<ISettings>(() => value, LazyThreadSafetyMode.PublicationOnly);
}
}
#endregion
private const string UserNameKey = "username_key"; //Key used to get your property
private static readonly string UserNameDefault = string.Empty; //Default value for your property if the key-value pair has not been created yet
public static string UserName {
get { return AppSettings.GetValueOrDefault<string>(UserNameKey, UserNameDefault); }
set { AppSettings.AddOrUpdateValue<string>(UserNameKey, value); }
}
}
Then to use that you would do this anywhere in your app:
SettingsImplementation.UserName = "something";
OR
string username = SettingsImplementation.UserName;
My own problem regarding this issue was due to me not explicitly saving the properties with the following line of code:
Application.Current.SavePropertiesAsync();
you can use Xamarin essentials "Preferences" instead:
Preferences.Set("Key", "Value");
Preferences.Get("Key", "Default");
I ran into the same issue.
The problem:
I was trying to throw complex objects into the Application Properties.
It turns out that the Properties can only take primitive data typs.
This Blog was very helpfull.
https://codemilltech.com/persist-whatever-you-want-with-xamarin-forms/

Android Viewpager to load images from SD Card

Guys Im using the following custom code to load 20 images from resources and present in a viewpager
public class CustomPagerAdapter extends PagerAdapter {
int[] mResources = {
R.drawable.slide1,
R.drawable.slide2,
R.drawable.slide3,
R.drawable.slide4,
R.drawable.slide5,
R.drawable.slide6,
R.drawable.slide7,
R.drawable.slide8,
R.drawable.slide9,
R.drawable.slide10,
R.drawable.slide11,
R.drawable.slide12,
R.drawable.slide13,
R.drawable.slide14,
R.drawable.slide15,
R.drawable.slide16,
R.drawable.slide17,
R.drawable.slide18,
R.drawable.slide19,
R.drawable.slide20,
};
Context mContext;
LayoutInflater mLayoutInflater;
public CustomPagerAdapter(Context context) {
mContext = context;
mLayoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
return mResources.length;
}
#Override
public boolean isViewFromObject(View view, Object object) {
return view == ((LinearLayout) object);
}
#Override
public Object instantiateItem(ViewGroup container, int position) {
View itemView = mLayoutInflater.inflate(R.layout.pager_item, container, false);
ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
imageView.setImageResource(mResources[position]);
container.addView(itemView);
return itemView;
}
#Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((LinearLayout) object);
}
}
This works fine but I want to put the jpgs in a directory on the device so that they can be changed without recompiling the app
I think I need to get the images into the mResource array. I can get the path but not sure what format the code should be instead of using the draw-able lines
i have read articles on here but none make sense to me I am really new to this and the code looks nothing like the code I am using
can anyone point me in the right direction?
Any help is greatly appreciated
Mark
Yes, you can certainly do so. I will try to explain you the process step-by-step,
Step 1
Have a File object pointing to the path, like,
File directory = new File("path-to-directory");
Ensure that the path is to the directory with the images,
Step 2
List all the files inside the directory using listFiles() method, like
File[] allImages = directory.listFiles();
Now you have an array of all the files just like int[] mResources. The only difference being, now you have actual file references, while previously you had resource ids.
Step 3
You can just display the images in the ViewPager just like you did previously. But this is a bit tricky and can take you a considerable amount of time and code to get an image properly displayed from File.
You also need to take care of caching, so that when you load a previously loaded image again, it gets it from the cache.
To do all this, I recommend you to use this library (recommended by Google), Glide.
Setting an image is one line of code,
Glide.with(context).from(file).into(imageView);
That's it. Now you have your images displayed in a ViewPager from a directory in the device.

RecyclerView lazy loading

I'm doing lazy loading on a RecyclerView adapter. First I fetch the image metadata (if it has any) and then let Picasso download the actual image.
public class PostHolder extends RecyclerView.ViewHolder implements Callback<Photo>{
private PostImageView cover;
private TextView content;
private long id;
public PostHolder(View itemView) {
super(itemView);
this.itemView.setOnClickListener(onClickListener);
content = (TextView) itemView.findViewById(R.id.post_content);
cover = (PostImageView) itemView.findViewById(R.id.post_image);
}
public void setPost(final Post post, int i){
cover.unsetImage();
this.id = post.getPhotoId();
itemView.setTag(i);
content.setText(post.getMessage());
if("photo".equals(post.getType()) || "video".equals(post.getType()) && id != 0L){
cache.get(id, this);
}else{
cover.setUrl(post.getImageUrl());
}
}
#Override
public void result(Photo result) {
if(result != null && result.getId() == PostHolder.this.id){
cover.setPhoto(result);
}
}
}
cache.get() loads my metadata from the cache, the result is returned with result().setPost() gets called in onBindViewHolder(). Now I'm getting everyone's favorite viewholder issue - my ImageView displays a different image before switching to the correct one. I know that Picasso correctly handles this and I have a check for my own loading where i compare the holder's id to the metadata id. I've spent a few hours on this already. Internet, you are my only hope.
It's fixed now, though I'm not exactly sure why. I believe it's
Picasso
.with(getContext())
.cancelRequest(this);
inside unsetImage() because of the double request needed to load it.
What I think happens:
Picasso is still loading the previous image.
A call for the current image metadata is dispatched.
Picasso loads the preVious image. Since Picasso doesn't know about the metadata, it's not automatically canceled.
The metadata get's loaded, and Picasso starts loading the current image.

How do I mask the current page behind a modal dialog box in vanilla GWT?

I've built a log-in composite that I am displaying in my application entry-point to the user. Upon entry of the username and password, I am sending the username and password to the server via a RemoteService and will receive back an object containing the ClientSession. If the ClientSession is a valid object (recognised username and password), I wish to display the main application panel otherwise I want to display the login dialog again (with an error message).
My question is, that during the async call to the server, how to I mask the screen so that the user cannot click anything whilst the Session is obtained from the server?
I know that the login should be fast, but the Session object contains a lot of Client Side cached values for the current user that is used to generate the main panel. This may take a fraction of a second or up to 5 seconds (I can't control the speed of the underlying infrastructure unfortunately) so I want to mask the screen until a timeout is reached then allow the user to try again.
I have done this exact operation before using GWT Ext, but vanilla GWT seems to have a lot less samples unfortunately.
Thanks
Chris
The GWT class PopupPanel has an optional "glass panel" that blocks interaction with the page underneath.
final PopupPanel popup = new PopupPanel(false, true); // Create a modal dialog box that will not auto-hide
popup.add(new Label("Please wait"));
popup.setGlassEnabled(true); // Enable the glass panel
popup.center(); // Center the popup and make it visible
You might want to check out GlassPanel from the GWT Incubator project. AFAICT it's not perfect, but should be of some help nevertheless ;)
You can also use a dialog box for this purpose.
Here is the code how to use it.
public class NTMaskAlert extends DialogBox {
private String displayText;
private String message;
private static NTMaskAlert alert;
Label lable;
private NTMaskAlert(String text) {
setText(text);
setWidget(new Image(GWT.getModuleBaseURL()
+ "/images/ajax-loader_1.gif"));
setGlassEnabled(true);
setAnimationEnabled(true);
super.show();
super.center();
WorkFlowSessionFactory.putValue(WorkFlowSesisonKey.MASKING_PANEL, this);
}
public static void mask(String text) {
if (text != null)
new NTMaskAlert(text);
else
new NTMaskAlert("Processing");
}
public static void unMask() {
NTMaskAlert alert = (NTMaskAlert) WorkFlowSessionFactory
.getValue(WorkFlowSesisonKey.MASKING_PANEL);
if (alert != null) {
alert.hide();
alert = null;
}
}
public void setDisplayText(String displayText) {
this.displayText = displayText;
alert.setText(displayText);
}
public String getDisplayText() {
return displayText;
}
public void setMessage(String message) {
this.message = message;
lable.setText(message);
}
public String getMessage() {
return message;
}
}
Use static mask and unmask method for operations.
This is my solution:
public class CustomPopupPanel extends PopupPanel {
private Label label = new Label();
public CustomPopupPanel() {
super(false, true); // Create a modal dialog box that will not auto-hide
super.setGlassEnabled(true); // Enable the glass panel
super.add(label); // Add the widget label into the panel
}
public CustomPopupPanel(String text) {
this();
this.mask(text);
}
public final void mask(String text) {
label.setText(text);
super.center(); // Center the popup and make it visible
}
public void unmask() {
super.hide(); // Hide the popup
}
}

Resources