Creation of a new view type by a code module

peacemaker · Feb 1, 2012

Hi, All

Is it possible by a code module to make a new view type, using standard views ?

For example, i'd like to make Tabs view (tabs like of TabHost view, but fully controllably by the design).

I think I need for the whole view: a Panel with overall dimensions, tabs qty.

For each tab i need an ImageView (for icon), a Label (for Title text with TextSize and Typeface properties), a ToggleButton for 2 graphical states (selected tab\unselected one).

How to make events, properties, their get\set subs to update the view ?
I'm trying and messed...:-(

B4X:

'Code module
'Subs in this code module will be accessible from all modules.
Sub Process_Globals
   'These global variables will be declared once when the application starts.
   'These variables can be accessed from all modules.
   Dim Top, Left, Width, Height As Int: Top = 0: Left = 0: Width = 300dip: Height = 50dip
   'Dim Visible As Boolean
   Dim TabCount, CurrentTab As Int
   Dim TextSize As Int, TextFont As Typeface
   Type aTab (aTabBody As ToggleButton , Title As Label, Icon As ImageView)
   Type Tabs (Container As Panel, ActivityName As String, EventName As String)
End Sub

Sub AddTab (TabsObj As Tabs, Title As String)
Dim a As aTab
a.Initialize
a.aTabBody.Initialize("AllTabs")
a.Title.Initialize("AllTabs")
a.Icon.Initialize("AllTabs")
TabsObj.Container.AddView(a, ???????????
End Sub

Sub AllTabs_Click
End Sub

Sub Initialize (ActivityName As String, EventName As String)
Dim t As Tabs
t.Container.Initialize("")
t.ActivityName = ActivityName
t.EventName = EventName
End Sub

Sub UpdateTabs (Top As Int, Left As Int, Width As Int, Height As Int, TextSize As Int, TextFont As Typeface)
End Sub

Cannot understand how to correctly make methods, properties changes, and event of the new view....

Deleted member 103 · Feb 1, 2012

Hi peacemaker,

look at my example, maybe it helps you.

http://www.b4x.com/forum/basic4android-share-your-creations/9446-numericupdown-android.html

Ciao,
Filippo

peacemaker · Feb 2, 2012

Thanks, Filippo, really good and clear

But how to be with separate extra properties, that do not belong to the standard views ?
Just make as variables of the module ?
I mean - how to update the new view if some separated properties are changed by active activity ?

Erel · Feb 2, 2012

Another example: Action List module - Creating a custom view

peacemaker · Feb 2, 2012

So, main is that

1)if used the standard views - they must be declared in the activity to be used, and code module is just common subs place.

2) ActionList is drawn manually, so created inside the code module without declarations in the Activity, excepting only the new view objects - as i'd like to have.

Correct ? :-(

Erel · Feb 2, 2012

You should create a Type that contains all the views that you want. It allows you to pass these views to the code module (and back).

peacemaker · Feb 2, 2012

I made so:

B4X:

'Code module
'Subs in this code module will be accessible from all modules.
Sub Process_Globals
   'These global variables will be declared once when the application starts.
   'These variables can be accessed from all modules.
   Dim TabCount, CurrentTab As Int
   Type aTab (aTabBody As ToggleButton , Title As Label, Icon As ImageView, Value As Object)
   Type Tabs (Container As Panel, ActivityName As String, SelectBackground As String, NonSelectBackground As String, TextSize As Int, TextFont As Typeface, EventName As String)
End Sub

Sub AddTab (TabsObj As Tabs, Title As String, Icon As String, ReturnValue As Object)

Dim a As aTab, aTabWidth As Int, SelectedPic, UnSelectedPic As BitmapDrawable, sld As StateListDrawable
a.Initialize
a.aTabBody.Initialize("AllTabs")
a.Title.Initialize("AllTabs")
a.Icon.Initialize("AllTabs")
a.Value = ReturnValue

aTabWidth = TabsObj.Container.Height/TabCount
a.aTabBody.Width = aTabWidth
a.Icon.Width = aTabWidth/4
a.Icon.Height = a.Icon.Width
If Icon <> "" Then 
   a.Icon.Bitmap =LoadBitmap(File.DirAssets, Icon)
   a.Title.Left = a.Icon.Left + a.Icon.Width
Else   'no icon 
   a.Title.Left = 0
End If

a.Title.Text = Title
a.Title.TextSize = TabsObj.TextSize
If TabsObj.TextFont <> Null Then a.Title.Typeface = TabsObj.TextFont
a.Title.Width = a.aTabBody.Width - a.Title.Left
a.Title.Height = a.Title.Height/2

If TabsObj.SelectBackground <> "" AND TabsObj.NonSelectBackground <> "" Then
   If TabsObj.SelectBackground <> "" Then SelectedPic.Initialize (LoadBitmap(File.DirAssets, TabsObj.SelectBackground))
   If TabsObj.NonSelectBackground <> "" Then UnSelectedPic.Initialize (LoadBitmap(File.DirAssets, TabsObj.NonSelectBackground))
   sld.Initialize
   sld.AddState(sld.State_Checked, SelectedPic)
   sld.AddState(sld.State_Unchecked, UnSelectedPic)
   a.aTabBody.Background = sld
End If

TabsObj.Container.AddView(a.aTabBody, TabCount * a.aTabBody.Width,0, a.aTabBody.Width, TabsObj.Container.Height)
TabsObj.Container.AddView(a.Icon, a.aTabBody.Left, 0, a.Icon.Width, a.Icon.Height)
TabsObj.Container.AddView(a.Title, a.Title.Left, 0, a.Title.Width, a.Title.Height)
TabCount = TabCount + 1
End Sub

Sub Initialize (Activity As Activity, ViewTop As Int, ViewLeft As Int, ViewWidth As Int, ViewHeight As Int, SelectBackground As String, NonSelectBackground As String, TextSize As Int, TextFont As Typeface, EventName As String) As Tabs
Dim t As Tabs

t.Container.Initialize("")
Activity.AddView(t.Container,ViewLeft,ViewTop,ViewWidth,ViewHeight)
t.ActivityName = Activity
t.EventName = EventName

t.NonSelectBackground = NonSelectBackground
t.SelectBackground = SelectBackground
t.TextFont = TextFont
t.TextSize = TextSize
End Sub

In Activity i declare

Dim Tabs1 As Tabs

and cannot make

Tabs1 = TabsModule.Initialize(Activity, 0, 0, 100%x, 100%y, "", "", 10, Null, "Tabs1")
TabsModule.AddTab(Tabs1, "Tab1", Null, 1)

having error at Sub Initialize

Erel · Feb 2, 2012

Which error?
If you like you can upload your project so we can help you better.

stevel05 · Feb 2, 2012

You need to include 'Return t' at the end of the initialize sub, but as Erel said, it would be easier to help if you posted the project.

peacemaker · Feb 2, 2012

Seems, i finally made something:

B4X:

'Activity module
Sub Process_Globals
   'These global variables will be declared once when the application starts.
   'These variables can be accessed from all modules.

End Sub

Sub Globals
   Dim Tabs1 As Tabs
End Sub

Sub Activity_Create(FirstTime As Boolean)
   'Activity.LoadLayout("1")
Tabs1 = TabsModule.Initialize(Activity, 20, 20, 80%x, 10%y, "v1.png", "v2.png", 10, Typeface.LoadFromAssets("segoe.ttf"))
TabsModule.AddTab(Tabs1, "Закладка номер 1", "book_add.png")
TabsModule.AddTab(Tabs1, "Website 2", "")
TabsModule.AddTab(Tabs1, "123456789012234", "")
TabsModule.AddTab(Tabs1, "Tab3", "wrench.png")
End Sub

Sub AllTabs_Click
Dim a As View
a = Sender
TabsModule.Selection(Tabs1, a.Tag)
End Sub

B4X:

'Code module
'Subs in this code module will be accessible from all modules.
Sub Process_Globals
   'These global variables will be declared once when the application starts.
   'These variables can be accessed from all modules.
   Dim TabCount, CurrentTab As Int
   Type aTab (aTabBody As Panel , Title As Label, Icon As ImageView, Value As Object)
   Type Tabs (Container As Panel, ActivityName As String, SelectBackground As String, NonSelectBackground As String, TextSize As Int, TextFont As Typeface)
End Sub

Sub AddTab (TabsObj As Tabs, Title As String, Icon As String)
Dim a As aTab, aTabWidth As Int, SelectedPic, UnSelectedPic As BitmapDrawable, sld As StateListDrawable

aTabWidth = TabsObj.Container.Width/(TabCount + 1)

Dim v0 As Object, v1 As Panel
For i=0 To TabsObj.Container.NumberOfViews - 1
   v0 = TabsObj.Container.GetView(i)
   If v0 Is Panel Then 
      v1 = v0
      CenterTab(v1, aTabWidth)
      v1.Left = v1.Width * v1.Tag
   End If
Next

a.Initialize
a.aTabBody.Initialize("AllTabs"):a.aTabBody.Tag = TabCount
a.Icon.Initialize("AllTabs"):a.Icon.Tag = TabCount
a.Title.Initialize("AllTabs"): a.Title.Tag = TabCount

TabsObj.Container.AddView(a.aTabBody, TabCount * aTabWidth,0, aTabWidth, TabsObj.Container.Height)
a.aTabBody.AddView(a.Icon, 0, 0, 1, 1)
a.aTabBody.AddView(a.Title, 0, 0, 1, 1)

a.aTabBody.Width = aTabWidth 'tab width
a.aTabBody.Left = TabCount * a.aTabBody.Width

CenterTab(a.aTabBody, aTabWidth)

If Icon <> "" Then 
   a.Icon.Bitmap = LoadBitmap(File.DirAssets, Icon)
   a.Title.Top = a.aTabBody.Height/2   'label top & height
   a.Title.Height = a.aTabBody.Height/2
Else   'no icon 
   a.Title.Top = a.aTabBody.Height/4
   a.Title.Height = a.aTabBody.Height * 0.7
End If

a.Title.Gravity = Bit.Or(Gravity.CENTER_HORIZONTAL, Gravity.CENTER_VERTICAL)
a.Title.Text = Title
a.Title.TextSize = TabsObj.TextSize
a.Title.BringToFront
a.Title.TextColor = Colors.Black
a.Title.Color = Colors.Transparent

If TabsObj.TextFont <> Null Then
   a.Title.Typeface = TabsObj.TextFont
End If

If TabsObj.SelectBackground <> "" AND TabsObj.NonSelectBackground <> "" Then
   a.aTabBody.SetBackgroundImage (LoadBitmap(File.DirAssets, TabsObj.NonSelectBackground))
End If

TabCount = TabCount + 1
End Sub

Sub CenterTab (Pnl As Panel, aTabWidth As Int)
Dim v0 As Object, v2 As ImageView, v3 As Label
Pnl.Width = aTabWidth
For i=0 To Pnl.NumberOfViews - 1
   v0 = Pnl.GetView(i)
   If v0 Is ImageView Then
      v2 = v0
      v2.Width = aTabWidth/3
      v2.Height = v2.Width
      v2.Left = (Pnl.Width - v2.Width)/2
   Else If v0 Is Label Then
      v3 = v0
      v3.Width = Pnl.Width * 0.7
      v3.Left = (Pnl.Width - v3.Width)/2
   End If
Next
End Sub


Sub Initialize (Activity As Activity, ViewTop As Int, ViewLeft As Int, ViewWidth As Int, ViewHeight As Int, SelectBackground As String, NonSelectBackground As String, TextSize As Int, TextFont As Typeface) As Tabs
Dim T As Tabs, tc As Panel
tc.Initialize("")
T.Container = tc
Activity.AddView(T.Container,ViewLeft,ViewTop,ViewWidth,ViewHeight)
T.ActivityName = Activity

T.NonSelectBackground = NonSelectBackground
T.SelectBackground = SelectBackground
If TextFont <> Null Then 
   T.TextFont = TextFont
Else
   T.TextFont = Typeface.DEFAULT
End If
T.TextSize = TextSize
T.IsInitialized = True

Return T
End Sub

Sub Selection (TabsObj As Tabs, CurTab As String)
Dim v1 As Object, v2 As Panel, s As String
For i=0 To TabsObj.Container.NumberOfViews - 1
   v1 = TabsObj.Container.GetView(i)
   If v1 Is Panel Then
      v2 = v1
      s = v2.Tag
      If s <> CurTab Then
         v2.SetBackgroundImage(LoadBitmap(File.DirAssets, TabsObj.NonSelectBackground))
      Else
         v2.SetBackgroundImage(LoadBitmap(File.DirAssets, TabsObj.SelectBackground))
      End If
   End If
Next
End Sub

Creation of a new view type by a code module

peacemaker

Expert

Deleted member 103

Guest

peacemaker

Expert

Erel

B4X founder

peacemaker

Expert

Erel

B4X founder

peacemaker

Expert

Erel

B4X founder

stevel05

Expert

peacemaker

Expert

Attachments