Programmatically select a tab of a Codename One Tabs object - codenameone

To programmatically select a tab of a Codename One Tabs object, the following code is enough:
tabs.setSelectedIndex(tabToSelect, true);
The problem is that this code selects the wanted tab but it doesn't horizontally scroll the tabs buttons container to make the tab name visible (if it's not visible because there are many tabs). Note that I'm using the theme constant tabsGridBool: false;.
Because of this issue, I tried to solve so:
tabs.setSelectedIndex(tabToSelect, true);
tabs.scrollComponentToVisible(tabs.getTabsContainer().getComponentAt(tabToSelect));
but it doesn't work. What is a proper way to select a tab and its button? Thank you

I tried this and it worked for me, it might be the order of the operations:
Form hi = new Form("Tabs", new BorderLayout());
Tabs t = new Tabs();
hi.add(CENTER, t);
for(int iter = 1 ; iter < 20 ; iter++) {
t.addTab("Tab " + iter, FontImage.MATERIAL_ACCESS_ALARM, 4, new Label("Tab " + iter));
}
Button test = new Button("Test");
test.addActionListener(e -> {
t.getTabsContainer().getComponentAt(18).requestFocus();
t.setSelectedIndex(18, true);
});
hi.add(SOUTH, test);
hi.show();

Related

Simulator is different to IPhone

I'm setting buttons, textfields and a picture so that there is a perfect looking on simulator IPhone6.
Then I put it on a real IPhone 6, there are some differences.
The picture isn't central, one button is half outside.
I program it by hand with no gui builder.
What is the best way, to set buttons, labels, textfields ... so that they are
correctly placed on hardware?
here my sample code:
Form dlgpass = new Form("");
dlgpass.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
Image img2;
try {
img2 = Image.createImage("/xz.jpg");
Container cco2 = BoxLayout.encloseX();
Label llc1 = new Label(" ");
Label llc2 = new Label(" ");
cco2.getStyle().setMarginBottom(50);
cco2.getStyle().setMarginTop(20);
cco2.add(llc1).add(img2).add(llc2);
dlgpass.add(cco2);
Label ll4 = new Label(" ");
Label ll5 = new Label(" ");
Container cco3 = BoxLayout.encloseX();
Label llc3 = new Label(„test");
cco3.getStyle().setMarginTop(100);
cco3.add(ll4).add(llc3).add(ll5);
Container cco4 = BoxLayout.encloseX();
TextField pa = new TextField("", "Password", 16, TextField.PASSWORD);
Label ll6 = new Label(" ");
Label ll7 = new Label(" ");
cco4.getStyle().setMarginTop(60);
cco4.add(ll6).add(pa).add(ll7);
dlgpass.add(cco4);
Button logi = new Button(" login ");
logi.addActionListener((e) -> chlogi(pa.getText(),ce));
Label ll1 = new Label(" ");
Label ll2 = new Label(" ");
Container cco1 = BoxLayout.encloseX();
cco1.getStyle().setMarginTop(60);
cco1.add(ll1).add(logi).add(ll2);
dlgpass.add(cco1);
The picture is 629x810 pixels with 24bit color.
This is a Splashscreen to login.
The pictures:
EDIT
Chen, this is what I tried. Is it what you meant?
Form dlgpass = new Form("", new BorderLayout());
Image img2;
img2 = Image.createImage("/xx.jpg");
ScaleImageLabel simg = new ScaleImageLabel(img2);
dlgpass.add(BorderLayout.CENTER, simg);
Container cco = new Container(new BorderLayout());
TextField pa = new TextField("", "Password", 16, TextField.PASSWORD);
cco.addComponent(BorderLayout.NORTH,pa);
FlowLayout flow = new FlowLayout(Component.CENTER);
flow.setValign(Component.BOTTOM);
Container cco1 = new Container(flow);
Button logi = new Button(" login ");
logi.addActionListener((e) -> chlogi(pa.getText(),ce));
cco1.addComponent(logi);
cco.addComponent(BorderLayout.SOUTH,cco1);
dlgpass.addComponent(BorderLayout.SOUTH,cco);
Avoid spaces, empty labels, setting margins on components use layouts to position the components on the From.
In your use case I would probably do something like this:
Form - BorderLayout.
ScaleImageLabel - center
Container(BorderLayout) - south
TextField - north
Container(FlowLayout center) - south
Button
if you need/want to space the components use setUIID() on the Components and in the theme adjust the margins and/or paddings (always use mm)
To understand layout positioning portability check out this video https://www.codenameone.com/how-do-i---positioning-components-using-layout-managers.html on using layout managers effectively.
Also check out Multi-Image which allow images to adapt to various sizes.

devExpress lookUpEdit does not show colums coming from dataset

I am trying to make an adding form with DevExpress. In my form, there is a lookUpEdit object and I am trying to fill it with columns coming from a dataset. So far, I wrote this:
this.companylookUpEdit.DataBindings.Add(new System.Windows.Forms.Binding("EditValue", this.incomesexpensesBindingSource, "company_id", true));
this.companylookUpEdit.EditValue = 1;
this.companylookUpEdit.Location = new System.Drawing.Point(100, 12);
this.companylookUpEdit.Name = "companylookUpEdit";
this.companylookUpEdit.Properties.Buttons.AddRange(new DevExpress.XtraEditors.Controls.EditorButton[] {
new DevExpress.XtraEditors.Controls.EditorButton(DevExpress.XtraEditors.Controls.ButtonPredefines.Combo)});
this.companylookUpEdit.Properties.DataSource = this.companyBindingSource;
this.companylookUpEdit.Properties.DisplayMember = "name";
this.companylookUpEdit.Properties.ValueMember = "id";
this.companylookUpEdit.Size = new System.Drawing.Size(209, 20);
this.companylookUpEdit.TabIndex = 22;
I want to show company name coming from companyBindingSource, and push corresponding company id to another dataset as an attribute.
When I run the application, the form appears, but when I click to the down arrow, nothing happens. Can anyone help me about this?

Remove "Add or Remove Buttons" in Rad Command Bar

I have a Rad Command Bar created with the code below:
RadCommandBar main = new RadCommandBar();
main.Dock = DockStyle.Top;
main.AutoSize = true;
main.Size = new System.Drawing.Size(874, 59);
CommandBarRowElement address = new CommandBarRowElement();
CommandBarStripElement strip = new CommandBarStripElement();
strip.FloatingForm = null;
strip.StretchHorizontally = true;
address.Strips.Add(strip);
CommandBarDropDownList addressEdit = new CommandBarDropDownList();
addressEdit.MaxSize = new System.Drawing.Size(0, 0);
addressEdit.VisibleInOverflowMenu = true;
addressEdit.StretchHorizontally = true;
main.Rows.Add(address);
parent.Controls.Add(main);
I'm having issue with hiding the "Add or Remove Buttons" of the strip element. Can someone point me to the right way to hide that menu?
You can use the following code:
strip.OverflowButton.Visibility = Telerik.WinControls.ElementVisibility.Hidden;
It it better to set the Visibility to Collapsed, in order to collapse the whole item. Using Hidden will hide the item, but its space will be retained. More information is available here: Customize the overflow button

WPF - Grid that must be a part of Page

Now I've a problem , because I want to create a number of pages that I want populate with a Grid and into the Grid. I want to create a series of Button.
How can I create a Grid into a Page?
I'm tried with following code:
SortedList<string, Page> pageList = new SortedList<string, Page>();
for (int i = 0; i < 3; i++)
{
pageList.Add(string.Format("Page{0}", i), new Page());
}
Grid LayoutRoot = new Grid(); // ???????
What I can do to insert a Grid into a Page? I want that refer to Grid for example:
pageList["Page2"].LayoutRoot;
Thanks.

TabControl - Scrolling between tabs

I'm trying to implement in WPF tab that behaves like the one in IE9.
When you open in the last many tabs, they are getting smaller and also to buttons are showen in the left and in the right, for scrolling between the tabs.
Any help would be very appritiated.
create two main tab (main tabs are these two tab in answer) like this
<TabItem Header="«" Name="LeftTab"/>
<TabItem Header="»" Name="RightTab"/>
set the visible of them to hiden. now add all tabs you want(with c# code or xaml) but dont forget set tag for all tab you add like below
<TabItem Header="new" Name="tiNew" Tag="1"/>
<TabItem Header="edit" Name="tiEdit" Tag="2"/>
...
now when tabs count go more than normal and you cant show all in 1 page Do Under :
1.change visible of two main tab..
bool is_Left_Right_tabVisible = false;
if (tabControl1.Items.Count > 8)
{
LeftTab.Visibility = System.Windows.Visibility.Visible;
RightTab.Visibility = System.Windows.Visibility.Visible;
is_Left_Right_tabVisible = true;
}
else
{
LeftTab.Visibility = System.Windows.Visibility.Hidden;
RightTab.Visibility = System.Windows.Visibility.Hidden;
is_Left_Right_tabVisible = false;
}
2.hidden all extra tab and only show some of them (example : show two main tab And show tab with tag 1-8)
3.if user click on main tabs (left or right tab) hidden one tab and visible another tab (example: you have lefttab-1-2-3-4-righttab when user click on right hidden NO 1 and vsible No 5 And focus on No 5)
private void RightTab_MouseUp(object sender, MouseButtonEventArgs e)
{
if (is_Left_Right_tabVisible)
{
TabItem ti = sender as TabItem;
if (ti.Name == "RightTab")
{
//find right tab must set to visible
int Showtabindex = 0;
var t1 = tabControl1.Items.OfType<TabItem>().Where(x => x.Visibility == System.Windows.Visibility.Hidden);
foreach (var item in t)
{
if (((int)item.Tag) > Showtabindex)
Showtabindex = (int)item.Tag;
}
//find left tab must go invisible
int Hiddentabindex = Showtabindex;
var t2 = tabControl1.Items.OfType<TabItem>().Where(x => x.Visibility == System.Windows.Visibility.Visible);
foreach (var item in t2)
{
if (((int)item.Tag) < Hiddentabindex)
Hiddentabindex = (int)item.Tag;
}
(tabControl1.Items[Hiddentabindex] as TabItem).Visibility = System.Windows.Visibility.Hidden;
(tabControl1.Items[Showtabindex] as TabItem).Visibility = System.Windows.Visibility.Visible;
//you can create drag and drop for tabs then user can change tab TAG
}
else if (ti.Name == "LeftTab")
{
//.....
}
}
}
i know it was abit hard but when i create a good user control i feel good .
but dont forget in this usercontrol we use tabcontrol we can create a custom tab control from first and dont use this tabcontrol.
you also can create animation for tabs when those change opacity and move animation would be good check this post

Resources