Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

text does not scale in TextView #12

Open
mgood7123 opened this issue May 13, 2019 · 13 comments
Open

text does not scale in TextView #12

mgood7123 opened this issue May 13, 2019 · 13 comments

Comments

@mgood7123
Copy link
Contributor

fun t(a: String): TextView {
            val textView = TextView(this)
            textView.text = a
            textView.setTextColor(Color.WHITE)
            textView.setAutoSizeTextTypeWithDefaults(TextView.AUTO_SIZE_TEXT_TYPE_UNIFORM)
            textView.setPadding(0, 0, 0, 0)
            textView.setTypeface(Typeface.MONOSPACE, Typeface.BOLD)
            return textView
        }

        AndroidToolkit.setup(this, R.drawable::class.java)
        val table = Table()
        table.tableLayout.debug()
        table.defaults().expand()
        table.add(t("a"))
        table.add(t("a"))
        Constraint.addView(table)

https://s.amsu.ng/9DXIX8eEL06N

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 13, 2019

https://s.amsu.ng/7imFzw7HHTxN

and buttons overlap

        table.add(android.widget.Button(this))
        table.add(android.widget.Button(this))

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 13, 2019

this is fixed for buttons by specifying both fill and expand but it does not work for textview as it aligns to the top left/right of the cell

@NathanSweet
Copy link
Member

Generally you size a root table to the entire area for your UI, then you add everything to that table. From the screenshots it looks like it is sized to the screen but to be sure, are you sizing the root-most table?

I'm afraid I don't have an Android development environment setup, so I can't test things right now. Also it's been a long time since I punished myself with Android's UI toolkit! If we can get you rolling with TableLayout though, much of the pain goes away.

BaseTableLayout uses AndroidToolkit#getPrefWidth/Height which is using view.getMeasuredWidth/Height() -- are those values what you'd expect? If they were large, it could explain why the buttons overlap: TableLayout thinks the button's preferred size is very large, larger than the available space.

Can you check AndroidToolkit.density? Does it help if you set it to 1 after calling setup?

@mgood7123
Copy link
Contributor Author

this is confusing but ill try

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 13, 2019

setting AndroidToolkit.density to 1F (short for 1.toFloat() or 1 as Float )appears to help with the button overlap

https://s.amsu.ng/iJpYtBV1XR1N

        AndroidToolkit.setup(this, R.drawable::class.java)
        AndroidToolkit.density = 1F
        Constraint.addView(
            Table().also {
                it.tableLayout.debug()
                it.defaults().expand()
                it.add(Button(this))
                it.add(Button(this))
            }
        )

@mgood7123
Copy link
Contributor Author

now, how to i make sure that i am sizing the root most table?

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 13, 2019

layout/table_empty.xml (R.layout.table_empty)

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
                                             android:layout_width="match_parent"
                                             android:layout_height="match_parent" android:id="@+id/ConstraintOnly">
</android.support.constraint.ConstraintLayout>

com/example/broadcastConsole/grid/MainActivity.kt

package com.example.broadcastConsole.grid

import android.graphics.Color
import android.graphics.Typeface
import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.widget.*
import com.esotericsoftware.tablelayout.android.AndroidToolkit
import com.esotericsoftware.tablelayout.android.Table
import com.example.broadcastConsole.R
import kotlinx.android.synthetic.main.table_empty.*


class MainActivity : AppCompatActivity(){

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.table_empty)

        fun t(a: String): TextView {
            val textView = TextView(this)
            textView.text = a
            textView.setTextColor(Color.WHITE)
            textView.setAutoSizeTextTypeWithDefaults(TextView.AUTO_SIZE_TEXT_TYPE_UNIFORM)
            textView.setPadding(0, 0, 0, 0)
            textView.setTypeface(Typeface.MONOSPACE, Typeface.BOLD)
            return textView
        }

        AndroidToolkit.setup(this, R.drawable::class.java)
        AndroidToolkit.density = 1F
        ConstraintOnly.addView(
            Table().also {
                it.tableLayout.debug()
                it.defaults().expand().fill()
                it.add(Button(this))
                it.add(Button(this))
                it.row()
                it.add(t("B"))
                it.add(t("B"))
            }
        )
    }
}

app/src/main/AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:dist="http://schemas.android.com/apk/distribution"
          package="com.example.broadcastConsole">

    <dist:module dist:instant="true"/>

    <application
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round"
            android:supportsRtl="true"
            android:theme="@style/AppTheme">
        <activity
                android:name="com.example.broadcastConsole.grid.MainActivity"
                android:label="@string/title_activity_grid"
                android:theme="@style/Theme.AppCompat.NoActionBar">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>

</manifest>

https://s.amsu.ng/2kWP2TrSonqN

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 14, 2019

table.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
                                             xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent"
                                             android:layout_height="match_parent" android:id="@+id/Constraint">

        <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent"
                      android:orientation="vertical">
            <TableLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:stretchColumns="*"
                    android:weightSum="4">
                <TableRow
                        android:layout_weight="1">
                    <TextView
                            android:text="p"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView2"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                    <TextView
                            android:text="r"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                </TableRow>
                <TableRow
                        android:layout_weight="1">
                    <TextView
                            android:text="e"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView4"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                    <TextView
                            android:text="p"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView3"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                </TableRow>
                <TableRow
                        android:layout_weight="1">
                    <TextView
                            android:text="r"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView6"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                    <TextView
                            android:text="e"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView5"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                </TableRow>
                <TableRow
                        android:layout_weight="1">
                    <TextView
                            android:text="c"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView8"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                    <TextView
                            android:text="o"
                            android:autoSizeTextType="uniform"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent" android:id="@+id/textView7"
                            android:fontFamily="monospace" android:typeface="monospace" android:textSize="8sp"
                            android:textAlignment="center"/>
                </TableRow>
            </TableLayout>
        </LinearLayout>
</android.support.constraint.ConstraintLayout>
        setContentView(R.layout.table)

https://s.amsu.ng/QXUJaxWg1IgN

and this is what i get if i attempt to recreate it

        fun t(a: String): TextView = TextView(this).also {
            it.text = a
            it.setAutoSizeTextTypeWithDefaults(TextView.AUTO_SIZE_TEXT_TYPE_UNIFORM)
            it.setTypeface(Typeface.MONOSPACE, Typeface.BOLD)
            it.textAlignment = TextView.TEXT_ALIGNMENT_CENTER
            it.layoutParams = ViewGroup.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT
            )
        }

        setContentView(R.layout.table_empty)
        AndroidToolkit.setup(this, R.drawable::class.java)
        AndroidToolkit.density = 1F
        ConstraintOnly.addView(
            LinearLayout(this).also {
                it.addView(
                    Table().also {
                        it.tableLayout.debug()
                        it.add(t("p")).center().fill().expand()
                        it.add(t("r")).center().fill().expand()
                        it.row()
                        it.add(t("e")).center().fill().expand()
                        it.add(t("p")).center().fill().expand()
                        it.row()
                        it.add(t("r")).center().fill().expand()
                        it.add(t("e")).center().fill().expand()
                        it.row()
                        it.add(t("c")).center().fill().expand()
                        it.add(t("o")).center().fill().expand()
                    }
                , ViewGroup.LayoutParams(
                        ViewGroup.LayoutParams.MATCH_PARENT,
                        ViewGroup.LayoutParams.MATCH_PARENT
                    )
                )
                it.orientation = LinearLayout.VERTICAL
            }
        )

https://s.amsu.ng/TDVVVLJxcw4N

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 14, 2019

it may be due to the layout_weight, weightSum, and stretchColumns being unsettable in the api, im not sure

all i know is that TableLayout has

android:stretchColumns="*"
android:weightSum="4"

and TableRow has

android:layout_weight="1"

@mgood7123
Copy link
Contributor Author

mgood7123 commented May 14, 2019

fun t(a: String): TextView = TextView(this).also {
            it.text = a
            it.setAutoSizeTextTypeWithDefaults(TextView.AUTO_SIZE_TEXT_TYPE_UNIFORM)
            it.setTypeface(Typeface.MONOSPACE, Typeface.BOLD)
            it.textAlignment = TextView.TEXT_ALIGNMENT_CENTER
            it.layoutParams = ViewGroup.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT
            )
        }

in which

        ConstraintOnly.addView(t("P"))

results in https://s.amsu.ng/gm0o3mJc2wqN
and

        ConstraintOnly.addView(
            Table().also {
                it.add(t("P"))
            }
        )

results in https://s.amsu.ng/MtMIFlFPyimN

@NathanSweet
Copy link
Member

setting AndroidToolkit.density to 1F (short for 1.toFloat() or 1 as Float )appears to help with the button overlap

OK. I don't remember what the density stuff was about, so I'll add a commit to keep it at 1.

it.tableLayout.debug()

Now that we have delegate methods, you can just use it.debug().

now, how to i make sure that i am sizing the root most table?

You use whatever Android UI stuff to make the root table the size you want, in the position you want.

I'm afraid the Android UI XML doesn't mean anything to me (that is some nasty stuff). The Android UI layouting is poor, TableLayout replaces it (once you have sized and positioned the root table). Also ConstraintOnly addView, LinearLayout, stretchColumns, layout_weight, etc are unfamiliar to me.

@mgood7123
Copy link
Contributor Author

ok, can you give me an example of a root most table

@NathanSweet
Copy link
Member

Not any time soon, I don't have Android stuff setup (and I honestly hate it). Replace the table with a button (or ViewGroup or anything else). Make the button take up the whole screen (or whatever area you want for your UI). Once you have that working, replace the button with the table and that is your root table. Add the rest of your UI to the root table and mostly you never have to deal with nasty Android UI again.

NathanSweet added a commit that referenced this issue Jul 4, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

2 participants