Forum Archive

[Share] Playing With TableView

dgm

Inspired by @Phuket2, I wanted to get a TableView working (there is probably some lines of his code that can be found in here). This is not perfect, but hopefully it will help someone. The UI sucks, tackling UI may be my next project. It was made on my iPhone6P, so Idk if it will work correctly or not on a different display.

When an item is added, then selected, it will return results of something (I don't know what, exactly. I was expecting an index out of range on that). Also, does anyone know why the very last cell (or 2 or 3..) does not like to stay in view when selected - when paging is enabled but a little out of balance?

import ui, console, random, objc_util

myData1 = [ui.View, ui.Button, ui.ButtonItem, ui.ImageView, ui.Label, ui.NavigationView, ui.ScrollView, ui.SegmentedControl,
           ui.Slider, ui.Switch, ui.TableView, ui.TextField, ui.TextView,ui.WebView, ui.DatePicker, ui.ActivityIndicator,
           ui.TableViewCell, ui.ListDataSource, console, objc_util]

class MyTableDataSource(ui.ListDataSource):
    def __init__(self, data):
        super().__init__(data)
        self.data = data

    def tableview_number_of_sections(self, tableview):
        return 1

    def tableview_number_of_rows(self, tableview, section):
        return len(self.data)

    def tableview_cell_for_row(self, tableview, section, row):
        return self.cell(row)

    def cell(self, row):
        selected_cell = ui.View()
        selected_cell.bg_color = "magenta"
        for x in self.data:
            cell = ui.TableViewCell()
            cell.bg_color = CELL_COLOR
            cell.selected_background_view = selected_cell
            cell.text_label.text = str(self.data[row])
            return cell

    def tableview_can_delete(self, tableview, section, row):
        #with paging_enabled, deleting (and/or selecting and viewing) the last row becomes a problem.
        #Hack_fix: only allow deleting while editing is enabled (and while editing is enabled, paging is disabled)
        #allowing selection/deletion/viewing of the last row(s)
        if not tableview.editing:
            return False
        return True

    def tableview_delete(self,tableview, section,row):
        self.data.remove(self.data[row])
        tableview.reload()
        return

    def tableview_can_move(self,tableview, section,row):
        return True

    def tableview_move_row(self,tableview, from_section, from_row, to_section, to_row):
        x = self.data[from_row]
        self.data.remove(self.data[from_row])
        self.data.insert(to_row, x)
        tableview.reload()

class MyTableViewDelegate (object):
    def tableview_did_select(self, tableview, row):
        if tv.name == 'attr_tv':
            def attrs(row):
                a = myData1[row]
                return((a,dir(a),len(dir(a))))
            a,d,l = attrs(row)
            s = str(a)
            s += '\n\n'.join(x for x in d) + '\n\n'
            s += '(' +''.join(str(l)) + ' attrs)'
            av.text = s

    def tableview_did_deselect(self, tableview, row):
            pass

    def tableview_title_for_delete_button(self, tableview, row):
        return 'Remove from List'

class MyView(ui.View):
    def __init__(self, ** kwargs):
        super().__init__(**kwargs)
        self.h = ui.View(frame = (0, 0, self.width, self.height))
        self.h.flex = 'lrwh'
        self.h.x,self.h.y = 0,0
        self.add_subview(self.h)

class ButtonHandler(object):
    def edit_button_tapped(self, sender):
        def Animation():
            #tv.alpha = .8 if tv.alpha == 1.0 else 1.0
            tv.paging_enabled = False if tv.paging_enabled == True else True
            rb.tint_color = LBC2 if rb.tint_color == LBC else LBC
            rb.title = 'Done' if rb.title == 'Edit' else 'Edit'
            #eb.alpha = .9 if eb.alpha == 1.0 else 1.0
            #eb.bg_color = '#90ee90' if eb.bg_color == GRAY else GRAY
            #eb.tint_color = LBC2 if eb.tint_color == LBC else LBC
            #eb.title = 'Done' if eb.title == 'Edit' else 'Edit'
            tv.editing = not tv.editing
        tvAnim = ui.animate(Animation, duration=0.5)

    def add_button_tapped(self, sender):
        @ui.in_background
        def add_item():
            input = console.input_alert('Add Item','Enter text for Item','My New Item','Submit')
            myData1.append(input)
            tv.reload()
        def Animation():
            lb.title = 'Add Item'
        tvAnim = ui.animate(Animation, duration=0.5)
        add_item()      

CELL_COLOR = (.47, 1.0, .51, 1.)
WHITE = (1.0, 1.0, 1.0, 1.0)
RED = (1.0, 0.0, 0.0, 1.0)
GRAY = (0.7, 0.7, 0.7, 1.0)
LBC = (1.0, .52, .0, 1.0)
LBC2 = (.39, 1.0, .27, 1.0)

handler = ButtonHandler()
w = ui.get_screen_size()[0]
h = ui.get_screen_size()[1]
f = (0, 0, w, h)

mv = MyView(frame=f, bg_color=WHITE, name='Attr Table')

#eb = ui.Button()
#eb.title = "Edit"
#eb.tint_color = LBC
#eb.flex='blr'
#eb.enabled = True
#eb.frame = (180, 300, 52, 32)
#eb.border_width = 1
#eb.border_color = (.0, .0, .0, 1.0)
#eb.corner_radius = 5
#eb.bg_color = GRAY
#eb.action = handler.button_tapped
#mv.h.add_subview(eb)


rb = ui.ButtonItem()
rb.tint_color = LBC
rb.title = "Edit"
rb.enabled = True
rb.action = handler.edit_button_tapped

lb = ui.ButtonItem()
lb.tint_color = LBC
lb.title = 'Add Item'
lb.enabled = True
lb.action = handler.add_button_tapped

tv = ui.TableView() 
tv.name = 'attr_tv'
tv.data_source = MyTableDataSource(myData1)

#tv.content_size = ( , )
#tv.autoresizing = 
#tv.center = (a,b,c,d
#tv.content_inset = (a,b,c,d)
#tv.content_mode = 
#tv.content_offset = (a,b)
#tv.content_size = (a,b)
#tv.decelerating =  #not writable
#tv.directional_lock_enabled = 
#tv.indicator_style = 

tv.flex="lrwb"
tv.frame=(0,0,mv.h.bounds[2],mv.h.bounds[3]*.4)
tv.row_height = tv.frame[3]/6
tv.corner_radius = 5
tv.border_width = 1
tv.border_color = 'magenta'
tv.bg_color = (.98, 1.0, .43,1.0)
tv.bounces = True

tv.paging_enabled = True
tv.shows_vertical_scroll_indicator = False
tv.reload_disabled = False
tv.editing = False
tv.allows_selection = True
tv.allows_selection_during_editing = True
tv.allows_multiple_selection = False
tv.allows_multiple_selection_during_editing = False
tv.delegate = MyTableViewDelegate

sv = ui.ScrollView()
sv.name = 'scrollview'
sv.flex = 'lrwhb'
sv.frame = (0,300,w,h)
sv.corner_radius = 5
sv.border_width = 1
sv.border_color = 'purple'
sv.bg_color = '#ff44a6'
sv.shows_horizontal_scroll_indicator = False
sv.shows_vertical_scroll_indicator = False
mv.add_subview(sv)

av = ui.TextView()
av.name = 'textview'
av.flex = 'lrwtbh'
av.frame = (0,0,w,440)
av.corner_radius = 5
av.border_width = 1
av.border_color = '#ff0000'
av.bg_color = '#b3fff5'
av.shows_horizontal_scroll_indicator = False
av.shows_vertical_scroll_indicator = True
av.text = 'Select an Attr'
av.font = 'Arial Rounded MT Bold', 20
sv.add_subview(av)

mv.left_button_items = [lb]
mv.right_button_items= [rb]

mv.h.add_subview(tv)
mv.present('fullscreen')
Phuket2

@dgm , really ui does not suck, it rocks. I really struggle with ui, but it's not ui I am struggling with. It's my ability with design, I struggle with. I am writing a pickdate object now. Here is the gist, but slow progress right now (guests visiting me). But it works and will work. Look, I don't like to share unfinished stuff, the gist is unfinished. Still Experimenting.
But I don't like what I have done. I started to rewrite it as @omz does in dialogs.py. But I just had problems getting my head around it. He is doing a MVC OR MVMV something like that. But I want to be able to write code like that. Although, I can't get my head around it now, i think it will be the right way. Or a version of the right way.
But please don't underestimate ui and the ui designer. It's very powerful as it is.

Phuket2

Actually, the code in the gist is out by one day. As I say, it's not finished. It was correct, but still playing with it.

Phuket2

Btw, I like what you did here. It's also a testimony to ui's flexibility

dgm

@Phuket2, I agree that the ui rocks! I was just saying that what I provided was not up to par.. The ListView was hanging down past the bottom of the screen, but at least the text scrolled into view. And now creating an awesome ui seems to be what I'd like to do next. I have been playing around with it , and I just see so many possibilities and don't know which way to go. My first setback is whether or not I want to use the editor or just code it all in.

Using the editor: I have achieved different results (with the same flex settings) based on placing things directly on the view, and placing things in a full subview of the view.. Still trying to figure that all out but making progress. It will at least help me know whats going on if I decide to just code it all in again.

Also, Pickdate is looking good!

Phuket2

@dgm , the designer is great. This gist Is worth a look. Not saying It's complete, but expands the idea of pyui/UIFiles. It's not my work, mainly @JonB work. But understanding the gist, puts a whole new light on pyui files.

Phuket2

@dgm , datepicker also not looking that great when you look at this. I want to be able to make all these styles effortlessly, a good approach to the architecture would help this. My way, is not there. I will finish my stupid way first, then go back and try to it more correctly.