Kann ich im App Invetor2 Elemente frei platzieren?

Kann mir jemand sagen ob ich im App Inventor2 Elemente frei platzieren kann?

Ich z.B. wenn ich mehrere Buttons erstelle diese nur automatisch auf den Screen setzen lassen und dann über das Menü des jeweiligen Screens center oder bottom oder Top einstellen. Wenn ich dann aber noch eine Grafik einfüge, die zB bottom sein soll, die Buttons aber top, dann kann ich das ja nirgends einstellen - ist das richtig?

Entschuldigt ich bin blutige Anfängerin :D

2 Antworten

Niklas

29.10.2018, 14:57

Die Apps, die man mit dem App Inventor herstellen kann, basieren auf Rasterlayouts (Grid-Systemen). Mir ist nicht bekannt, dass man darin relative Layouts erstellen kann, bei denen Elemente (wie in Android Studio), flexibel positioniert werden könnnen.

Mit etwas Geschick kannst du dir ein Rasterlayout erstellen und das Element an der gewünschten Stelle im Rasterlayout positionieren.

Scamander1926

29.10.2018, 14:55

Nein, du musst unter ich glaube layout oder design die module verwenden

Ähnliche Beiträge

Class in css und html wird nicht angesprochen, was tun?

Ich habe eine Frage zum Thema html und css. Die class .logo lässt sich nicht ansprechen und wenn ich mit vsc versuche verschiedene "classes" anzusprechen schlägt er mir nur alte gelöschte "classes" vor. Vielleicht kann mir ja jemand bei diesem Problem helfen Danke im vorraus :)

hier ist der Code:

index.html

<!DOCTYPE html>

<html>

<head>

<title>beispiel</title>

</head>

<body>

<nav>

<li><a href="">Element 2.1</a></li>

<li><a href="">Element 3.1</a></li>

<li><a href="">Element 4.1</a></li>

<li><a href="">Element 5.1</a></li>

<li><a href="">Element 6.1</a></li>

<li><a href="">Element 7.1</a></li>

<li><a href="">Element 8.1</a></li>

</ul>

<li><a href="">Element 1</a></li>

<li><a href="">Element 2</a></li>

<li><a href="">Element 3</a></li>

<li><a href="">Element 4</a></li>

<li><a href="">Element 5</a></li>

<li><a href="">Element 6</a></li>

<li><a href="">Element 7</a></li>

<li><a href="">Element 8</a></li>

</ul>

</nav>

</body>

</html>

style.css

* {

margin: 0;

padding: 0;

}

html {

height: 100%;

}

body {

background-color: rgb(214, 214, 214);

}

nav {

width: 100%;

}

.leftnav {

float: left;

list-style: none;

background-color: cadetblue;

}

.topnav {

width: 100%;

float: right;

list-style: none;

background-color: crimson;

margin-bottom: 0;

}

nav .leftnav li {

margin-left: 25px;

margin-top: 30px;

margin-right: 25px;

margin-bottom: 30px;

}

nav .topnav li {

float: right;

display: inline-block;

margin-right: 50px;

margin-top: 20px;

margin-bottom: 20px;

}

nav .topnav .firstlielement {

display: inline-block;

margin-right: 50px;

margin-top: 20px;

margin-bottom: 20px;

}

nav .topnav li a {

text-decoration: none;

color: white;

}

nav .leftnav li a {

color: rgb(50, 60, 197);

text-decoration: none;

}

nav .leftnav li a:hover {

color: rgb(173, 174, 196);

text-decoration: none;

}

nav .topnav li a:hover {

color: rgb(81, 253, 1);

text-decoration: none;

}

.logo {

}

...zum Beitrag

Css Elemente nebeneinander und nicht untereinander?

Wie kann ich diese Elemente so positionieren, dass sie nebeneinander und nicht untereinander sind?

HTML:

  <div>
    <div v-for="recipe in recipes" :key="recipe.id">
      <div class="recipe">
        <img class="recipe-img" :src="recipe.img" alt="" />
        <div class="recipe-description">
          <h3 class="recipe-title">{{ recipe.title }}</h3>
          <h4 class="recipe-time">
            <i class="far fa-clock"></i> {{ recipe.time }} Minutes
          </h4>
          <h4 class="level">
            <i class="far fa-check-circle"></i> {{ recipe.level }} to make
          </h4>
        </div>
      </div>
    </div>
  </div>

CSS:

.recipe-img {
  width: 300px;
  height: 300px;
  object-fit: cover;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}


.recipe {
  margin: 30px;
}


.recipe-description {
  text-align: center;
  margin-top: 10px;
  border: 1px solid #444;
  border-top: none;
  padding: 10px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  background-color: #444;
  color: white;
  width: 300px;
}


.recipe-title,
.recipe-time,
.recipe-level {
  margin: 5px;
}

...zum Beitrag

Android Studio App stürzt ab nach klick auf Button?

Hallo,

ich habe eine Android Studio Applikation mit einer Bottom Navigation bar, bei welcher unter dem Reiter "Profile" ein User hinzugefügt werden soll. Wenn ich dort auf "Add User" klick stürzt die App allerdings ab, in der Version ohne Navigationsbar funktioniert das allerdings einwand frei. Vielleicht kann mir jedmand helfen, den Fehler zu finden.

Hier ist die UI von Profile:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout ...
    ...
    <Button
        android:id="@+id/btAddUser"
        ...
        android:text="Add User"
        android:onClick="onAddUser"
        />

</LinearLayout>

Hier die UI der BottomBar:

<?xml version="1.0" encoding="utf-8"?>
<...
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/fragment_container"
        >  
...
 app:menu="@menu/bottom_navigation"/>
    </FrameLayout>

Die Klasse zur BottomBar:

package com.example.bottomnav;
import ...
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

BottomNavigationView bottomNavigation = findViewById(R.id.bottom_navigation);    bottomNavigation.setOnNavigationItemSelectedListener(navListener);
getSupportFragmentManager().beginTransaction().replace(R.id.fragment_container,
...
private BottomNavigationView.OnNavigationItemSelectedListener navListener =
new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull @NotNull MenuItem item) {
Fragment selectedFragment = null;
switch (item.getItemId())
{
case R.id.nav_projects:
selectedFragment = new ...
ProfileFragment();
break;
}
                    getSupportFragmentManager().beginTransaction().replace(R.id.fragment_container,
selectedFragment).commit();
return true;
}};}

Hier der Code zum Profil hinzufügen:

@Nullable
@org.jetbrains.annotations.Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    return inflater.inflate(R.layout.fragment_profile, container, false);
}

public
class MyActivity extends AppCompatActivity {
    ...

    Button btAddUser;
...

    Boolean isAdmin = Boolean.FALSE;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.fragment_profile);
       ...
        btAddUser = findViewById(R.id.btAddUser);

        btAddUser.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {onAddUser(btAddUser);}

    public void onAddUser(View view) {
...

...zum Beitrag

Java: JDialog Buttons hinzufügen?

Hey! Ich versuche ein Dialogfenster zu erstellen, das aus 5 Spalten und 5 Reihen besteht. In jedes Feld des Fenster soll der gleiche Button eingesetzt werden; sprich ich möchte in das Dialogfenster 25 Buttons einfügen. Dazu haben ich folgenden Code geschrieben. Leider erscheint im Dialogfenster nur ein einziger Button, obwohl ich in der for-Schleife eigentlich dafür sorge, dass 25 Buttons eingesetzt werden sollen. Kann mir jemand helfen? Vielen Dank schon mal im Voraus :)

import java.awt.*;  
import java.awt.event.* ;
import javax.swing.*;
public class Aufgabe26 {
public static void main(String[] args) {
    // Dialog-Fenster erzeugen
    JDialog object = new JDialog();
    // Titel erzeugen
    object.setTitle("My first program");
    // Größe und Position des Fensters einstellen
    object.setBounds(500, 150, 500, 500); 
    // Fenster in Kästchen (wie Tabellenform) einteilen (verschiedene Positionen)
    object.setLayout(new GridLayout(5,5));
    
    Button b = new Button("Text");
    
    // 25 Buttons ins Fenster platzieren
    for (int k = 1; k < = 25; k++) {
        object.add(b);
    }
    
    // Dialogfenster sichtbar machen
    object.setVisible(true);
    // Dialogfenster dauerhaft machen
    object.setModal(true);
    
}

}

...zum Beitrag

Was ist Notifikation?

bei der app 'Instant buttons' kann man die töne auch als Klingeltöne oder als Notifikation einstellen, nur was ist das?

...zum Beitrag

Elementor Hintergrund 2 Farbig?

Huhu,

Ich bin noch Anfänger.

Ich möchte wie auf dem Foto es 2 Farbig links und rechts haben.

Allerdings möchte ich auch diesen Kreativen Übergang haben?

Wie nennt man sowas?

Es gibt ja Shape Divider die man dann Kreativ einstellen kann, aber die funktionieren nur auf Top und Bottom.

Freue mich auf Hilfe!

Liebe Grüße

...zum Beitrag

Button auf nur einem Bestimmten block platzieren?

Wie kann ich einen Knopf in Minecraft einstellen, das ich diesen z.B. nur auf einem Knopf placen kann?

Der Befehl wird ja so ähnlich sein;

/give @p diamond_pickaxe 1 0
{CanDestroy:
  [
    stained_glass,
    nether_brick_fence,
    fence_gate
  ]}

...zum Beitrag

Schwarzer Screen mitten beim editieren (Magix Deluxe premium)?

Moin Leute,

hab eine Frage und zwar is Mitten beim editieren von einem Video der Screen schwarz geworden und hat sich aufgehangen. Beim reset der App war das immer noch so -> Man kann kein neues Projekt starten, kein Play Button oder Vorspul Button. Wie kann man das beheben ?

...zum Beitrag

Screen Aufnahme App ohne Störungen?

Hallo,

kennt ihr zufällig Bildschirmaufnahme-Apps, bei denen während der Aufnahme keine lästigen Buttons/Wasserzeichen am Screen auftauchen, die nachher noch im Video zu sehen sind? Einfach aufnehmen, ohne von Meldungen gestört zu werden...

Liebe Grüße

...zum Beitrag

Handy seniorengerecht einrichten: Notruf-Button für Android?

Ich bin auf der Suche nach einer möglichst simpel gestrickten App, die es mir erlaubt, einen einfachen Notruf-Button auf dem Homescreen zu platzieren. Wenn man den drückt, sollte automatisch der Notruf gewählt werden und ihm sowie hinterlegten Notfallkontakten eine Nachricht samt Standort geschickt werden.

Der Playstore ist da leider ziemlich überfüllt ... Habt ihr gute Empfehlungen?

...zum Beitrag

WetterApp mit HTML, Css und C# über Blazor Server App?

Hallo undzwar bin ich neu in C# und möchte über die Blazor Server App eine Wetter-App programmieren, allerdings fehlt mir dazu noch der Code, da ich nicht weiß wie ich anfangen soll. Ich möchte dass mein "SearchIcon" welcher in HTML hinterlegt ist als suchbutton fungiert, damit ich die Städte suchen kann und über API möchte ich, dass mir dann die jeweiligen Temperaturen angegeben werden. Kann mir wer helfen und gegebenenfalls einen Code dafür geben.

Hier mein HTML code:

</div>

</div>

<div>

</div>

</div>

<img src="/images/image1.png" width="75" height="75" class="imageline "

<img src="/images/image1.png" width="75" height="75" class="imageline " style="margin-left: 5px; margin-right: -5px;"

<img src="/images/image1.png" width="75" height="75" class="imageline " style="margin-left: 22px; margin-right: -5px;"

<img src="/images/image1.png" width="75" height="75" class="imageline " style="margin-left: 5px; margin-right: -14px;"

</div>

<div>

<p style="color:black;"class="line0 title margin-left ">Monday</p>

<p style="color:black;"class="line0 title margin-left ">Tuesday</p>

<p style="color:black;"class="line0 title margin-left ">Wednesday</p>

<p style="color:black;"class="line0 title margin-left ">Thursday</p>

<p style="color: black;"class="line0 title margin-left ">Friday</p>

</div>

<div>

<p class="speed">Humidity</p>

</div>

<div>

<p class="speed">Wind Speed</p>

</div>

</body>

hier mein Css code:

.backgroundimage {

background-image: url('../images/sun_background.png');

background-attachment: fixed;

background-repeat: no-repeat;

background-size: cover;

}

.cloud-background {

background-image: url('../images/cloud.png');

/* Füge hier die gewünschten Hintergrundbilderigenschaften hinzu */

}

.card {

width: 90%;

max-width: 470px;

color: #fff;

margin: 10px auto 0;

border-radius: 20px;

}

.search{

width: 100%;

display: flex;

align-items: center;

justify-content: space-between;

}

.search input{

border: 0;

outline: 0;

background: #ebfffc;

color: #555;

padding: 10px 25px;

height: 60px;

border-radius: 30px;

flex: 1;

margin-right: 16px;

font-size: 18px;

}

.search button{

border: 0;

outline: 0;

background: #ebfffc;

border-radius: 60%;

width: 60px;

height: 60px;

cursor: pointer;

}

.weather-icon{

margin-bottom: -30px;

}

.weather h1 {

font-size: 80px;

font-weight: 500;

color: floralwhite;

}

.weather h2 {

font-size: 40px;

font-weight: 400;

margin-top: -10px;

color: floralwhite;

}

.details {

display: flex;

align-items: center;

justify-content: space-between;

padding: 0 20px;

margin-top: 50px;

}

.col {

display: flex;

align-items: center;

text-align: left;

margin-top: 150px;

}

.col img {

width: 20px;

margin-right: 20px;

margin-bottom: 70px

}

.humidity, .wind{

font-size: 28px;

margin-top: -6px;

color: floralwhite;

}

.speed{

font-weight: bold;

}

.temp {

margin-bottom: 20px;

display: flex;

justify-content: center;

}

.search button img{

width: 55%;

}

.center {

display: flex;

justify-content: center;

}

.top-left{

display: flex;

justify-content:left

}

.top-left

{

margin-left: 10px;

}

.margin-top{

margin-top: 20px;

}

.hr1 {

width: 390px;

height: 2px;

color: black;

}

.line{

margin-bottom: -100px;

margin-top: 10px;

}

.line1{

margin-top: 30px;

margin-bottom: -20px;

}

.line0{

margin-top: 70px;

margin-bottom: -90px;

font-size: 14px;

font-weight: bold;

color: black;

}

.imageline {

margin-top: 5px;

margin-bottom: -90px;

}

.imagesMain {

padding: 0;

margin-left: auto;

margin-right: auto;

margin-top: 20px;

text-align: center;

}

.imagesMain img {

height: 400px;

width: 300px;

vertical-align: middle;

}

.title {

display: inline-block;

color: lightgray;

}

.margin-left{

margin-left: 14px;

}

...zum Beitrag

Welche 3D brille für Side by Side 3D verwenden

hi ich habe einen philips 3D Pcmonitor und mankan bei den einstellungen 2Dzu 3D; Top to bottom;side by side einstellen. Aber welche Brille braucht man für Side by Side ? und ist Side by Side 3D besser als 2d zu 3d? danke im vorraus:)

...zum Beitrag

Android-Smartphones: Gibt es eine Möglichkeit, den On-Screen Homebutton entfernen?

Nach Jahren mit dem iPhone wollte ich mir nun ein HTC One A9 zulegen. Dieses besitzt, neben dem On-Screen Home-Button, einen Fingerabdruck-Sensor, welcher auch als Home-Button verwendet werden kann.

Da ich keine zwei Homebuttons brauche, wollte ich wissen, ob ich den On-Screen Home-Button irgendwie loswerden kann, sei es per App oder sonst wie. Wichtig wäre mir dabei, dass entweder die anderen On-Screen Buttons weiterhin bestehen bleiben (also kein Immersive-Mode) oder dass die anderen Buttons durch Gesten etc. ersetzt werden (z.B. "zurück wischen").

Da ich mich überhaupt nicht mit Android auskenne, wollte ich einfach einmal fragen, ob es hier Profis gibt, die mir da weiterhelfen können!

Schließlich will man ja auch sein Android-Phone mit Stil benutzen.

Ich hoffe auf viele hilfreiche Antworten von euch schlauen Köpfen da draußen!

...zum Beitrag

Padding, Kurzschreibweise korrekt?

Hallo, ich bin mir bei folgender Sache gerade unsicher. In CSS gibt es ja sowohl eine ausführliche Schreibweise als auch eine Kurzschreibweise für Box-Elemente wie padding.

Wenn ich in CSS formuliere --> padding: 0 2rem 0 2rem, dann steht das doch für

padding-top: 0;

padding-right: 2rem;

padding-bottom: 0;

padding-left: 2rem;

Das habe ich so als Beispiel gefunden. Ich frage mich aber, warum der Urheber hier nicht einfach padding: 0 2rem; formuliert, weil da sowohl padding-top als auch padding-bottom hinsichtlich ihrer Werte identisch sind (und sich somit zusammenfassen lassen), als auch padding-right und padding-left identisch sind und sich ebenfalls zusammenfassen lassen.

Liege ich da richtig oder stehe ich auf dem Schlauch?

...zum Beitrag

Was möchtest Du wissen?

Deine Frage stellen