I have looked everywhere in the ProMotion docs and examples but I am unable to find a way to change a TableScreen layout, specifically the TableView cell's vertical starting position.
I have an UIView on the top of my screen to show some buttons, and the TableView cells should start underneath, but right now they are on top of each other.
I have even managed to move the TableView using the REPL console:
rmq(4496872960).nudge d: 10
where 4496872960 is the id of my UITableViewWrapperView object, but I have no idea where to put the layout coordinates for this object in code.
My screen code:
class HomeScreen < PM::TableScreen
title I18n.t("home_screen.title")
tab_bar_item title: I18n.t("home_screen.title"), item: "icon-home_32x32.png"
row_height :auto, estimated: 30
stylesheet HomeScreenStylesheet
def on_load
#matches = [{attributes: {status: "dummy1", player2: {email: "dummy1#match.com"}}},{attributes: {status: "dummy2", player2: {email: "dummy2#match.com"}}}]
append(TopHomeView, :top_home_view)
set_nav_bar_button :left, title: I18n.t("home_screen.sign_out_label"), image: image.resource("icon-logout-32x32.png"), action: :sign_out
set_nav_bar_button :right, title: (Auth.current_user ? Auth.current_user["email"] : ""), image: image.resource("icon_user_50x50.png"), action: :open_profile
load_async
end
def table_data
[{
cells: #matches.map do |match|
{
title: match[:attributes][:player2][:email],
subtitle: match[:attributes][:status],
action: :play_round,
arguments: { match: match }
}
end
}]
end
EDIT:
I have kept trying to solve this and I have now added a style to my UITableViewWrapperView object like this:
def viewDidLoad
super
rmq(UITableViewWrapperView).apply_style(:style_for_table_wrapper)
end
In my stylesheet I am able to therefore style everything: background_color, hidden status, but the frame style is just ignored.
def top_home_view(st)
st.frame = {l:20, t: 20, w: 300, h: 60}
st.background_color = color.white
end
As indicated in this Github issue:
https://github.com/infinitered/ProMotion/issues/784#issuecomment-230962988
the solution here lies in implementing a Header view for the TableScreen. This lets us have an area on top of the cells for our own use:
Define a table_header_view returning an instance of a UIView (required):
class HomeScreen < PM::TableScreen
# ...
def table_header_view
create!(TopHomeView, :top_home_view)
end
Note that the "bang method" (create!) will return an instance of UIView.
Credit goes to https://github.com/andrewhavens for clearing this up
Related
I have 2 Screens in my app (ScreenManager). One of them has ActionBar with ActionOverflow. I have button that should change current Screen and close ActionOverflow, but the Screen changes and ActionOverflow remains open until
I tap the screen in another place.
Here some code:
# .kv
ScreenManager:
id: ScrMan
Screen:
name: 'scr1'
BoxLayout:
orientation: 'vertical'
ActionBar:
ActionView:
ActionOverflow:
id: ActOv
#some buttons
ActionButton:
text: 'some text'
on_press:
ActOv.is_open = False
#I also tried: is_open = False; self.parent.is_open = False; with the same result
ScrMan.current = 'scr2'
Screen:
name: 'scr2'
#some cool stuff here
How I can change the screen and close ActionOverflow list?
Edit: As you have version 1.9.1 (or older master branch, there was this fix missing. Changing actionbar.py in <python dir>/Lib/site-packages/kivy/uix/actionbar.py brings the default behavior to the old version.
The dropdown should close on its own by default. Maybe there's something wrong in your code e.g. placing ActionButton into ActionOverflow as a widget or maybe something else. Try this:
from kivy.lang import Builder
from kivy.base import runTouchApp
from kivy.uix.boxlayout import BoxLayout
Builder.load_string('''
#:import Clock kivy.clock.Clock
#:import partial functools.partial
<Test>:
ScreenManager:
id: ScrMan
Screen:
name: 'scr1'
ActionBar:
pos_hint: {'top': 1}
ActionView:
ActionPrevious:
ActionOverflow:
ActionButton:
text: 'some very very long text'
ActionButton:
text: 'some very very long text'
ActionButton:
text: 'some very very long text'
ActionButton:
text: 'some very very long text'
ActionButton:
text: 'some very very long text'
ActionButton:
text: 'try this button!'
on_press:
ScrMan.current = 'scr2'
Clock.schedule_once(partial(root.change_scr, ScrMan), 1)
Screen:
name: 'scr2'
Label:
text: 'second'
''')
class Test(BoxLayout):
def change_scr(self, man, *dt):
man.current = man.previous()
runTouchApp(Test())
Do famo.us surface have any support for pseudo CSS selectors? Specifically, I'm trying to style the placeholder text on an InputSurface. Any way of doing this without giving it a class and using CSS?
Famo.us at this time has not created any special pseudo-element styling helper. Famo.us supports the changing of styles through setProperties of the Surface object.
Surfaces in version 0.3.0 also support the attributes option. Add an attribute for the placeholder as shown in the code below.
Example of working code here
var surface = new InputSurface({
size: [200, true],
content: '',
attributes: {
placeholder: 'Enter Something'
}
});
You could also use the setAttributes method:
var surface = new InputSurface({
size: [200, true],
content: ''
});
surface.setAttributes({ placeholder: 'Enter Something'});
surface.setProperties({borderColor:'red'});
Im quite new to rubymotion and Promotion so sorry if the question is a stupid one :) I can't find any information how to manipulate a height of a cell after clicking on it. Somebody knows how to do this? Thanks a lot
class TimeOffsScreen < ProMotion::TableScreen
def table_data
TimeItem.all.map do |item|
{
title: item.name,
action: :open_time_item,
arguments: { item: item },
editing_style: :delete,
height: 90
}
end
end
def open_time_item(item)
# Set height of this table cell
end
end
There isn't a great way to do this currently. One way you can accomplish it is to access the data in your hash and then refresh the table data.
By the way, I noticed a bug in your code. You need to provide an array of sections wrapping your cells.
I've put an example of how to do this here, but you'll need to verify that it does work.
def table_data
#time_items ||= TimeItem.all
[{
cells: #time_items.map do |item|
{
title: item.name,
action: :open_time_item,
arguments: { item: item },
editing_style: :delete,
height: item.height || 90
}
end
}]
end
def open_time_item(item)
item.height = 180 # .height can be a temporary attr_accessor with no persistence
update_table_data
end
I am creating an iOS app using RubyMotion. I would like to create a custom looking tabBar therefor I need to know how to change tab programmatically and how to get the current tab. Is this possible? How can I do it?
You could try using motion-tab to create the tab bar.
Basic Usage (from the Readme)
def application(application, didFinishLaunchingWithOptions:launchOptions)
#window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds)
tabs = [
{
systemIcon: UITabBarSystemItemContacts,
navigationController: true,
viewController: ContactsViewController
}, {
title: "Custom",
icon: "custom.png",
navigationController: false,
viewController: CustomViewController.alloc.initWithCustomInit(true)
}, {
title: "Settings",
icon: "settings.png",
navigationController: true,
viewController: SettingsViewController
}
]
tabBarController = MotionTab::TabBar.createTabBarControllerFromData(tabs)
MotionTab::TabBar.select(tabBarController, title: "Settings")
# MotionTab::TabBar.select(tabBarController, tag: 0) # Selects first tab
#window.rootViewController = tabBarController
#window.makeKeyAndVisible
end
The gem doesn't have the current tab functionality now, but it wouldn't be too difficult to add a class attribute to MotionTab::TabBar that returns the current tab.
I'm new to Sencha Touch and the Ext JS logic. Actually, I'm displaying a list of items containing two fields (title, type) grouped by default alphabetically by first character of the title and I added a button to a toolbar that I want it to switch the grouping to be by type. I tried to programmatically set the getGroupString function in the buton handler in this way :
var toolbar = new Ext.Toolbar({
dock: 'top',
title: 'Toolbar',
items: [{
text: 'By type',
handler: function() {
MyApp.MyStore.getGroupString = function(record) {
return record.get('type');
};
MyApp.itemsList.update();
}
}]
});
But that seems just to not work. Any help ?
Thanks
Just wanted to close the question as I have already answered it
MyApp.itemsList.refresh();