Consider something like this:
new RootElement ("Root"){
new Section ("Section A") {
new EntryElement("Element in A")
}
new Section ("Section B") {
new EntryElement("Element in B")
}
}
and Monotouch.Dialog will create you TableView with two sections. Now I want the second section to be located not right under the first section but rather at very bottom of the screen. How can I do that?
It seems you can trick Monotouch.Dialog by defining empty HeaderView for the section. It will expand the space between sections. Something like this:
lastSection.HeaderView = new UIView(new RectangleF(0,0,0,80));
I'm not sure though this is the right approach. Worked for me.
I do not believe MonoTouch.Dialog can do this of the box. You will need to:
Define a large transparent UITableViewCell subclass.
Define an ‘Element’ subclass and override it’s GetCell(...) method to provide the cell you subclassed above.
Implement IElementSizing on the element above and implement GetHeight(...) to describe the height of the transparent cell between the first and last cells.
Create an empty Section with the Element subclass between your top EntryElement and the bottom EntryElement section.
The resulting code would look something like this:
this.Root = new RootElement ("Root") {
new Section ("Section A") {
new EntryElement("Element in A")
}
new Section("") {
new EmptyElement()
}
new Section ("Section B") {
new EntryElement("Element in B")
}
};
Related
I am trying to finish up a custom cell for my tables using monotouch.dialog, and have nearly everything sorted out, except for my cell's detail text label colour.
I am overriding GetCell to customise my EntryElement cell like this:
public class CustomStyledEntryElementPlain : MonoTouch.Dialog.EntryElement
{
public CustomStyledEntryElementPlain (string _caption, string _value) : base(string.Empty,string.Empty,string.Empty,false)
{
KeyboardType = UIKeyboardType.Default;
Value = _value;
ReturnKeyType = UIReturnKeyType.Done;
Caption = _caption;
}
public override UITableViewCell GetCell(UITableView tableView) {
var cell = base.GetCell(tableView);
cell.BackgroundColor = Resources.XDarkGrayColor;
cell.TextLabel.TextColor = Resources.XWhiteColor;
cell.BackgroundView = new UIView (RectangleF.Empty);
cell.DetailTextLabel.TextColor = UIColor.White; //this line causes the error
return cell;
}
}
I then create the elements like so:
new CustomSection ("Testing"){
new CustomStyledEntryElementPlain("Test","Test1"),
new CustomStyledEntryElementPlain("Test","Test2")
},
However, on displaying the table, I get the error: "System.NullReferenceException has been thrown Object reference not set to an instance of an object"
I could have sworn when I initially prototyped this that I had the DetailTextLabel text color working! Commenting out the change of course results in my table and cell displaying just fine, albeit with black text (which I want to change to white!)
Has anyone got any idea as to why I am getting this?
The DetailTextLabel property in the UITableViewCell is only available if the Cell has a UITableViewCellStyle that supports it. From the UITableViewCell documentation for the DetailTextLabel property:
UITableViewCell automatically creates the secondary (detail) label if the cell is created with a MonoTouch.UIKit.UITableViewCellStyle that supports a detail label.
If the cell's style doesn't support a detail label, this property returns null.
Check the documentation for UITableViewCellStyle to find out which styles support this property.
The MonoTouch.Dialog RootElement does not appear to have a way of adding a subtitle. I would like to display a subtitle below the caption.
Do I have to subclass the element and add a custom view to in the GetCell method?
Is there a simpler option?
The simplest way to achieve this is to subclass RootElement and override GetCell method, create a new cell and set the LabelText and DetailLabelText. This will give you a nice subtitle
public override MonoTouch.UIKit.UITableViewCell GetCell(MonoTouch.UIKit.UITableView tv) {
var baseCell = base.GetCell(tv);
var cell = new UITableViewCell(UITableViewCellStyle.Subtitle, "cellId");
cell.TextLabel.Text = Caption;
cell.DetailTextLabel.Text = _subtitle;
cell.Accessory = baseCell.Accessory;
return cell;
}
Note the cell Style. Unfortunately, it looks like the cell style is available only during cell construction and not afterward. So you cant just call base.GetCell(tv) and set it's style. That would have been a better option.
_subTitle is a class level variable set via the custom constructor
private string _subtitle = string.Empty;
public ChartSectionRootElement(string caption, string subTitle) : base(caption) {
this._subtitle = subTitle;
}
I've encounter a problem with editable table cells. I'm using the TableView in my project just as the Tutorial on Oracle.
According to it, I use the setCellFactory method to reimplement the table cell as a text field with the help of the TextFieldTableCell class. However, I found the steps is a little complex to get to the point where the cell can be edited:
Let the table cell be selected by using direction key.
Press “Enter” to converts the cell to a text filed so that it is ready to be edited.
Clicking in the text field allows the contents to be edited
The problem is step 3, that you must use the mouse to click before you can input data in this table cell.
So, is there a solution to avoid step 3? That is the text field allows the data inputting when you just press “Enter”(step 2).
By the way, English is not my native language. Hope I have made myself clear.
The Node can be focused manually. The TextFieldTableCell is a TableCell that has a Node (Graphic) TextField which will be rendered when the cell is in editing mode. You need to focus to this textField manually but by using TextFieldTableCell you cannot access to the textField. However if you would prefer the alternative way described in the tutorial you are referring, then you have a chance to focus. The only changed method from that tutorial is:
#Override
public void startEdit() {
super.startEdit();
createTextField();
setText(null);
setGraphic(textField);
textField.selectAll();
// Set the focus
Platform.runLater(new Runnable() {
#Override
public void run() {
textField.requestFocus();
}
});
}
To start editing in a TableView without mouse-click event, invoke TreeView.edit(rowIndex, tableColumn);
For example:
//create tableview object
TableView<YourModel> tableView = new TableView<>();
//create column
TableColumn<YourModel, String> column = new TableColumn<>("Property Name");
//add column to tableview
tableView.getColumns().add(column);
//... your cell factory and the rest
//add an item
tableView.getItems().add(new YourModel());
//if you want to edit the selected item, get its index
int selectedIndex = tableView.getSelectionModel().getSelectedIndex();
//fire edit
tableView.edit(selectedIndex, column);
I'm trying to make a box that allows you to select some variables, and re-order the ones that are selected. So the LEFT box starts filled, the RIGHT box starts empty. You move items from the left to the right, and on the right you can re-arrange their order (with the up and down buttons). This lets you pick what items you want and in what order (for sorting purposes in another section of the program).
The layout I'm going for looks like of like this:
Unfortunately, it's coming out like... well... :-(
The functionality I'm looking for all works. Yay. I am just having a very hard time with the layout. I think if I can reach the following four primary objectives, I'll be set.
How can I get the OK and CANCEL buttons on the bottom instead of above the multis?
How can I get the multis to have a pre-set size (let's say... 10)
How can I get the arrow buttons to be stacked vertically instead of horizontally?
How can I get the arrow buttons to be between the two multis?
I figure each of these particular objectives are probably one-liners, perhaps a little bit of plumbing here and there...
On a side note, I'm using GridLayout - this might be a poor choice. Is there a better choice for something like this?
Without further ado, here's the code that generates this horrid mess...
#Override
protected Control createDialogArea(Composite parent) {
parent.getShell().setText("Multi-sort");
Composite dialogcomp = new Composite(parent, SWT.NONE);
dialogcomp.setLayout(new GridLayout(3, false));
available = new List(getShell(), SWT.BORDER | SWT.V_SCROLL);
for(String t : MultiSortDialog.availableNames) {
available.add(t);
}
used = new List(getShell(), SWT.BORDER | SWT.V_SCROLL);
for(String t : MultiSortDialog.usedNames) {
used.add(t);
}
createButton(parent, ADD, ">", false);
createButton(parent, REM, "<", false);
createButton(parent, UP, "^", false);
createButton(parent, DOWN, "V", false);
return dialogcomp;
}
I would suggest you simple use the Dialog's default OK and Cancel buttons and not trying to lay out your own. SWT has a nice system for placing them in the system default location (i.e., on Mac OS, the OK button will be on the right, which is the correct location.)
Don't use Dialog.createButton() to create buttons. This creates a button on your dialog which, although it sounds like what you want to do, actually isn't. This creates a button in the style of OK or Cancel buttons, expected to be placed in the button bar composite that the Dialog class owns and styled appropriately for the bottom row OK/Cancel buttons. You want to create a new Button in the composite you're creating. That is:
Button addButton = new Button(dialogcomp, SWT.PUSH);
addButton.setText(">");
addButton.addSelectionListener(...);
To stack the buttons vertically, create a new composite inside dialogcomp to contain them.
To put the arrow buttons between the Lists, you need to ensure that you add things in the correct order. With a GridLayout, you need to add widgets in the order that you want them to appear.
Other points:
Don't change the title of the dialog by calling Shell.setText(). Call setText() in your
Don't try to parent your Lists inside the parent shell. You're given a composite to put things in. This will wreak havoc on your layouts. You're basically hoisting widgets up into things you don't own and don't layout. Instead, put it in the Composite you created.
You may also wish to create buttons with the type SWT.ARROW | SWT.LEFT instead of simply drawing a < sign. It may be more visually appealing. Just something to investigate.
A simple rearrangement of your code, creating Buttons properly, and creating a new composite to hold the buttons, will get you much closer:
Composite dialogcomp = new Composite(parent, SWT.NONE);
dialogcomp.setLayout(new GridLayout(3, false));
available = new List(dialogcomp, SWT.BORDER | SWT.V_SCROLL);
for(String t : MultiSortDialog.availableNames) {
available.add(t);
}
Composite buttonComposite = new Composite(dialogcomp, SWT.NONE);
buttonComposite.setLayout(new GridLayout(1, false));
Button addButton = new Button(buttonComposite, SWT.PUSH);
addButton.setText(">");
Button removeButton = new Button(buttonComposite, SWT.PUSH);
removeButton.setText("<");
Button upButton = new Button(buttonComposite, SWT.PUSH);
upButton.setText("^");
Button downButton = new Button(buttonComposite, SWT.PUSH);
downButton.setText("v");
used = new List(dialogcomp, SWT.BORDER | SWT.V_SCROLL);
for(String t : MultiSortDialog.usedNames) {
used.add(t);
}
This will probably get you pretty close to what you want. However, you will probably want to apply GridDatas for each of your instances. For example, your two Lists will probably want to grab and fill horizontally and vertically to fill the layout as the Dialog is resized. But I'll leave that as an exercise for the reader.
Is there a way i can hide the border of the selected cell(or make the border color as white)in a qtablewidget.. By default a border with dotted line is shown.. Can u help me...
I prefer to do:
ui->tableWidget->setFocusPolicy(Qt::NoFocus);
You can also change the focus policy using the design tab.
It looks like this dotted border around selected cell you're trying to hide is a focus rectangle. Any given cell can have focus and not be selected at the same time and vice-versa. If you want this border to not get painted use an item delegate. There you can remove State_HasFocus style from the item's state before painting it. Pls, see an example below on how to do this, it's c++, let me know if you have troubles converting it to python
// custom item delegate class
class NoFocusDelegate : public QStyledItemDelegate
{
protected:
void paint(QPainter* painter, const QStyleOptionViewItem& option, const QModelIndex& index) const;
};
void NoFocusDelegate::paint(QPainter* painter, const QStyleOptionViewItem & option, const QModelIndex &index) const
{
QStyleOptionViewItem itemOption(option);
if (itemOption.state & QStyle::State_HasFocus)
itemOption.state = itemOption.state ^ QStyle::State_HasFocus;
QStyledItemDelegate::paint(painter, itemOption, index);
}
...
// set the item delegate to your table widget
ui->tableView->setItemDelegate(new NoFocusDelegate());
hope this helps, regards
Qt::NoFocus will remove the selected state of rows in QTableWidget.
The Python3/PySide2 version to the accepted answer:
class NoFocusDelegate(QtWidgets.QStyledItemDelegate):
def paint(self, painter: PySide2.QtGui.QPainter, option: PySide2.QtWidgets.QStyleOptionViewItem, index: PySide2.QtCore.QModelIndex) -> None:
itemOption = QtWidgets.QStyleOptionViewItem(option)
if option.state & QtWidgets.QStyle.State_HasFocus:
itemOption.state = itemOption.state ^ QtWidgets.QStyle.State_HasFocus
super().paint(painter, itemOption, index)
table.setItemDelegate(NoFocusDelegate())
Worked perfectly for me.