delete empty space borders in dhtmlxLayout web skin - layout

How to delete empty space borders from dhtmlxLayout web skin, to make it similar to skyblue skin?
document.getElementsByClassName(" dhxtabbar_base_dhx_web")[0].style.margin = 0;
doesn’t work

You need
.dhxlayout_base_dhx_web div.dhx_cell_layout div.dhx_cell_cont_layout {
padding: 0;
}

Related

Adding nested stackviews programmatically using xamarin.ios c#

I am creating a app for both android and ios using xamarin and mvvmcross.
In the ios app I want to add outer vertical stackview having nested horizontal stackviews. Basically I just want to create a basic person details screen where will be Label on left and textfield on right which will go in one horizontal stackview and like this there will many horizontal stackviews nested in outer vertical stackview.
I am looking for such example on internet but seems most of the examples are in swift but I was hardly able to find some in c#.
Can someone please help.
Thanks,
Santosh
UIStackView leverages the power of Auto Layout and Size Classes to manage a stack of subviews, either horizontally or vertically, which dynamically responds to the orientation and screen size of the iOS device. You can learn about it through this documentation.
In your case, we can construct a vertical stack to place several horizontal stack:
UIStackView verticalStack = new UIStackView();
View.AddSubview(verticalStack);
verticalStack.Axis = UILayoutConstraintAxis.Vertical;
verticalStack.TranslatesAutoresizingMaskIntoConstraints = false;
// Use auto layout to embed this super vertical stack in the View. Also there's no need to set the height constraint, vertical stack will automatically adjust that depending on its content
verticalStack.LeadingAnchor.ConstraintEqualTo(View.LeadingAnchor).Active = true;
verticalStack.TopAnchor.ConstraintEqualTo(TopLayoutGuide.GetBottomAnchor()).Active = true;
verticalStack.TrailingAnchor.ConstraintEqualTo(View.TrailingAnchor).Active = true;
for (int i=0; i<10; i++)
{
// Here try to put some horizontal stack with Label on left and textfield on right in the father stack.
UIStackView horizontalStack = new UIStackView();
horizontalStack.Distribution = UIStackViewDistribution.EqualSpacing;
horizontalStack.Axis = UILayoutConstraintAxis.Horizontal;
// UIStackView should use AddArrangedSubview() to add subviews.
verticalStack.AddArrangedSubview(horizontalStack);
UILabel textLabel = new UILabel();
textLabel.Text = "text";
UITextField textField = new UITextField();
textField.Placeholder = "enter text";
horizontalStack.AddArrangedSubview(textLabel);
horizontalStack.AddArrangedSubview(textField);
}
But if every horizontal stack's subViews are almost the same style and layouts. Why not try to use UITableView? You just need to set the single cell's contents and layouts, then use it in the tableView. Moreover this control is reused and scrollable.

List view with custom view items with partially overlaps (Android)

I want to implement a list in Android that contains some customized views.
My problem is that I want the the views will be put one after the other with a little overlap between them. like in the following schema:
I also want to control this overlap in such a way that when the user clicks on one of the items, they will move apart from each other.
I tried to extend ListView but it seems to be very obscured, any suggestions?
Edit:
This can be more clear:
I did it by setting the divider height to -50dp.
this is exactly what I want to achieve, but somehow it doesn't reflect on my app.
I managed to achieve this by using scroll view with a single relative layout as a child.
I then dynamically place the views by defining a rule and margin:
for (int i = 0; i < 30; i++) {
TextView tv = new TextView(context);
tv.setText("Text \n Text" + i);
tv.setBackgroundColor(i % 2 == 0 ? Color.RED : Color.GREEN);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
lp.leftMargin = 0;
lp.topMargin = (i * 45);
rl.addView(tv, lp);
}
Later, you can control the positioning of the sub-views by changing their y value (for example: if you want to add animation).
This is the final result:
This can probably be achieved by using the Camera.setTranslate function. See Android: Vertical ListView with overlaped rows and Android: vertical 3d listview for similar questions (with solutions)

Keep Checkbox group items from wrapping?

I have a check box group with multiple items that may contain a space. It is a horizontal check box. What is happening is the items are wrapping where there is a space in the item.
How could I get them to not wrap?
Also how do I control the width? I tried setting the width of the control and even placed it in a panel with the width set but nothing seems to work.
Try something like this in your stylesheet for the application:
.xspCheckBox { width: 500px; /* change to your preferred width */ }
.xspCheckBox td { white-space: nowrap; }

How do I dock a UserControl into a FlowLayoutPanel?

I have a FlowLayoutPanel and a UserControl.
I've added multiple usercontrols into the FlowLayoutPanel, and I'm trying to dock them to the top, so when I change the size of the FlowLayoutPanel the size (width) of the usercontrols changes accordingly.
You cannot dock anything inside a FlowLayoutPanel, it's simply ignored.
Check out the answer here apparently posted by the Microsoft team.
They say:
The FlowLayoutPanel relies on a largest control to effectively define the column/row within it. The code below set's the size of the first control to the width of the FLP to achieve a layout similar to what you want.
private void flowLayoutPanel1_Layout(object sender, LayoutEventArgs e)
{
flowLayoutPanel1.Controls[0].Dock = DockStyle.None;
for (int i = 1; i < flowLayoutPanel1.Controls.Count; i++)
{
flowLayoutPanel1.Controls[i].Dock = DockStyle.Top;
}
flowLayoutPanel1.Controls[0].Width = flowLayoutPanel1.DisplayRectangle.Width - flowLayoutPanel1.Controls[0].Margin.Horizontal;
}
Key thing is to use the Layout event.
This solution worked for me up to a point. Your UserControls have to have AutoSize turned off / stay a uniform size.
In my case I wanted AutoSize turned on so as to allow the UserControl to expand/contract vertically while filling the width of the FlowLayoutPanel.
I had to find a different solution. But the above might help you in your case.

tag cloud, layout: horizontal, and Appcelerator Titanium

Please note: This question relates to the Appcelerator Titanium platform, not the stock iOS SDK.
I'm making a tag cloud with a layout: horizontal view. I'm most of the way there, but I can't get the final Titanium.UI.Label on a line to wrap if it doesn't fit. Instead, it gets ellipsized (in a useless manner).
Is there a way I can prevent this on iOS? Seems to work fine on Android.
If you try to set the label width to auto, Titanium will calculate the label width in runtime.
It make sense to get a ellipsized label in horizontal view.
You may need to determine the dynamic label width in your tag cloud case. But just leave it to titanium, you just need to change the dynamic width to static width with this tricky code.
for (var i = 0; i < data.length; i++) {
var label = Ti.UI.createLabel({ text: data[i], width: 'auto', height: 20,left: 5, top: 5});
label.width = label.width + 5; //this determine width in runtime assign back to static width
view.add(label);
}
The iPhone's answer to this is minimumFontSize but that makes no sense in a tag cloud... Have you considered adding this to a horizontal scrollview and setting the contentWidth to auto?
Also does each of your label have it's width set to 'auto'? I imagine setting that would cause the word to overflow the layout and be pushed down to the next line.

Resources